It slowly draws a butterfly if u move your mouse from left to right!<\/p>\n\n\n\n
<\/a><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/*\n * Andrew J Wang\n * ajw2@andrew.cmu.edu\n * Section A\n *\n * This Program is ButterFly and Flower Curves\n *\/\n\n\n\nfunction setup() {\n createCanvas(480,480);\n}\n\nfunction draw() {\n background(220);\n\/\/create constrain for the rest of the codes' mouse X and Y\n var conY = constrain(mouseY,0,height);\n var conX = constrain(mouseX,0,width);\n\/\/create two array sets for Flower's X and Y\n var pointX2 = [];\n var pointY2 = [];\n\/\/remapping A and B with mouse X and Y\n\/\/A => inner circle, B => outer circle \n var a = map(conY,0,width,50,150);\n var b = map(conX,0,width,5,15);\n var h = 20;\n\/\/using for loop to get points\n for (var k=0; k<=2000; k+=1)\n { \n \/\/2 PI but 2000 points\n var t=k\/1000*Math.PI;\n \/\/epitrochoid formulas for X and Y\n var xP2= width\/2+((a+b)*Math.cos(t)-h*cos(((a+b)\/b)*t));\n var yP2= height\/2+((a+b)*Math.sin(t)-h*sin(((a+b)\/b)*t));\n \/\/push values to lists\n pointX2.push(xP2);\n pointY2.push(yP2);\n }\n\/\/connect vertexes and close them\n push();\n noFill();\n \/\/stroke\n stroke(0);\n strokeWeight(5);\n beginShape();\n for (var k=0; k<=2000; k+=1)\n { \n vertex(pointX2[k],pointY2[k]);\n }\n endShape(CLOSE);\n pop();\n\/\/connect vertexes and close them\n push();\n \/\/no stroke only fill\n fill(255,200,200);\n strokeWeight(0);\n beginShape();\n for (var k=0; k<=2000; k+=1)\n { \n vertex(pointX2[k],pointY2[k]);\n }\n endShape(CLOSE);\n pop();\n\/\/same logics but this time it is the butterfly curves\n var pointX = [];\n var pointY = [];\n for (var k=0; k<=2400; k+=1)\n { \n \/\/Mouse Y dictate how big the butterfly will be\n var xP= width\/2-map(conY,0,width,0,100)*Math.sin(k\/100*Math.PI)*((Math.exp(Math.cos(k\/100*Math.PI))) - (2*Math.cos(4*(k\/100*Math.PI))) - (Math.pow(Math.sin((k\/100*Math.PI)\/12), 5)));\n var yP= height\/2-map(conY,0,width,0,100)*Math.cos(k\/100*Math.PI)*((Math.exp(Math.cos(k\/100*Math.PI))) - (2*Math.cos(4*(k\/100*Math.PI))) - (Math.pow(Math.sin((k\/100*Math.PI)\/12), 5)));\n pointX.push(xP);\n pointY.push(yP);\n }\n\n\/\/this time I use smaller circles to represent the curves\n fill (90,map(conY,0,width,0,255),100);\n stroke (90,map(conY,0,width,0,255),100);\n \/\/mouse X dictates how many circles\n for (var k=0; k<=conX*4; k+=1)\n\n {\n circle (pointX[k],pointY[k],3);\n }\n }\n\n\n\n\n<\/code><\/pre><\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>It slowly draws a butterfly if u move your mouse from left to right! \/* * Andrew J Wang * ajw2@andrew.cmu.edu * Section A * * This Program is ButterFly and Flower Curves *\/ function setup() { createCanvas(480,480); } function draw() { background(220); \/\/create constrain for the rest of the codes’ mouse X and Y … <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/10\/15\/project-7-curves-2\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> “Project 7 – Curves”<\/span><\/a><\/p>\n","protected":false},"author":768,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[108,55],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/74463"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/users\/768"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=74463"}],"version-history":[{"count":1,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/74463\/revisions"}],"predecessor-version":[{"id":74464,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/74463\/revisions\/74464"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=74463"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=74463"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=74463"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}