{"id":67893,"date":"2021-10-17T15:03:56","date_gmt":"2021-10-17T19:03:56","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/?p=67893"},"modified":"2021-10-17T15:13:05","modified_gmt":"2021-10-17T19:13:05","slug":"curves-3","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/10\/17\/curves-3\/","title":{"rendered":"Curves"},"content":{"rendered":"\n

sketch<\/a><\/a><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/\/Yanina Shavialenka\n\/\/Section B\n\nvar n;\nvar heartShape = [];\nvar theta = 0;\nvar nPoints = 55;\n\nfunction setup() {\n createCanvas(480, 480);\n}\n\nfunction draw() {\n background(map(mouseX, 0, width, 0, mouseY));\n heartCurve();\n epitrochoidCurve();\n hypotrochoidCurve();\n astroidCurve();\n}\n\nfunction heartCurve() {\n \/\/https:\/\/mathworld.wolfram.com\/HeartCurve.html\n push();\n fill(255, 153, 255);\n stroke(73, 84, 216);\n translate(width\/2, height\/2-35);\/\/changes (0,0) point to center the heart in the middle\n beginShape(); \/\/Begins to draw heart curve\n for (var v of heartShape) {\n vertex(v.x, v.y); \n }\n endShape(); \/\/Ends drawing heart curve\n \/\/The following equations were taken from teh MathWorld\n var radius = height \/ 40; \/\/sets how big the heart is on the canvas\n var xPos = 16 * pow(sin(theta), 3) * radius;\n var yPos = (13 * cos(theta) - 5 * cos(2 * theta) - 2 * cos(3 * theta) - cos(4 * theta)) * -radius;\n heartShape.push(createVector(xPos, yPos));\n theta += 0.8; \/\/changes the angle by 0.8 each time which increases the outer blue stroke\n pop();\n}\n\nfunction epitrochoidCurve() {\n \/\/https:\/\/mathworld.wolfram.com\/Epitrochoid.html\n var b = 3.5; \n var h = (b + 5) + mouseX\/100;\n var a = mouseX\/b;\n push();\n noFill();\n stroke(0, 0, mouseX);\n translate(180, height\/2-50);\n \/*\n Changes (0,0) point to center the epitrochoid on the \n left side of a heart.\n *\/\n beginShape(); \/\/Begins to draw epitrochoid curve\n \/\/The following equations were taken from teh MathWorld\n for(var t = 0; t <= TWO_PI; t += PI\/110){\n var xPos = (a+b) * sin(t) - h * sin(((a+b)\/b) * t);\n var yPos = (a+b) * cos(t) - h * cos(((a+b)\/b) * t);\n vertex(xPos,yPos);\n }\n endShape(); \/\/Ends drawing epitrochoid curve\n pop();\n}\n\nfunction hypotrochoidCurve() {\n \/\/https:\/\/mathworld.wolfram.com\/Hypotrochoid.html \n var b = 3.5; \n var h = mouseY\/2; \/\/As height increases, the get little sharp crown circles\n \/\/As height decreases, we get oval star curves instead of crown circles\n var a = mouseX\/b;\n push();\n noFill();\n stroke(mouseX, 0, 0);\n translate(width\/2+70, height\/2-35);\n \/*\n Changes (0,0) point to center the hypotrochoid on the \n right side of a heart.\n *\/\n beginShape(); \/\/Begins to draw hypotrochoid curve\n \/\/The following equations were taken from teh MathWorld\n for (var i = 0; i <= nPoints; i ++) {\n var t = map(i, 0, 50, 0, TWO_PI);\n var xPos = (a-b) * cos(t) + (h * cos(((a-b)\/b) * t));\n var yPos = (a-b) * sin(t) - (h * sin(((a-b)\/b) * t));\n vertex(xPos,yPos);\n }\n endShape(); \/\/Ends drawing hypotrochoid curve\n pop();\n}\n\nfunction astroidCurve() {\n \/\/https:\/\/mathworld.wolfram.com\/Astroid.html\n var a = map(mouseX, 0, width, 0, height);\n push();\n noFill();\n stroke(0, mouseX, 0);\n translate(width\/2, 300);\n \/*\n Changes (0,0) point to center the astroid at the \n bottom of a heart.\n *\/\n beginShape(); \/\/Begins to draw astroid curve\n \/\/The following equations were taken from teh MathWorld\n for (var i = 0; i < height; i++) {\n var t = map(i, 0, width, 0, TWO_PI);\n var xPos = 3 * a * cos(t) + a * cos(3 * t);\n var yPos = 3 * a * sin(t) - a * sin(3 * t);\n vertex(xPos,yPos);\n }\n endShape(); \/\/Ends drawing astroid curve\n pop();\n}<\/code><\/pre><\/p>|\n\n\n\n<p>In this project I drew the curve of a heart and inside of a heart there’s 3 addition curves. Epitrochoid and hypotrochoid in my opinion were kind of like opposite of each other since epitrochoid draws ellipses inside and hypotrochoid draws ellipses outside. For me it was kind of challenging to do this because I had to research a lot of new functions such as Math.pow and many things for me didn’t work so I had to change the curves multiple times for them to work. It was interesting to analyze how angles of 0.1 or 1 would affect the curves, sometimes the smaller the angle the bigger the shape became which is polar opposite of what would I have expected. <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"906\" height=\"898\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-2.14.26-PM.png\" alt=\"\" class=\"wp-image-67898\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-2.14.26-PM.png 906w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-2.14.26-PM-300x297.png 300w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-2.14.26-PM-150x150.png 150w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-2.14.26-PM-768x761.png 768w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\"><\/figure><figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"914\" height=\"862\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.10.28-PM.png\" alt=\"\" class=\"wp-image-67899\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.10.28-PM.png 914w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.10.28-PM-300x283.png 300w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.10.28-PM-768x724.png 768w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\"><\/figure><figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"928\" height=\"948\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.10.53-PM.png\" alt=\"\" class=\"wp-image-67900\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.10.53-PM.png 928w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.10.53-PM-294x300.png 294w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.10.53-PM-768x785.png 768w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\"><\/figure><figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"950\" height=\"962\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.11.16-PM.png\" alt=\"\" class=\"wp-image-67901\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.11.16-PM.png 950w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.11.16-PM-296x300.png 296w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.11.16-PM-768x778.png 768w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 1362px) 62vw, 840px\"><\/figure><figure class=\"wp-block-image size-full\"><img loading=\"lazy\" width=\"746\" height=\"816\" src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.11.33-PM.png\" alt=\"\" class=\"wp-image-67902\" srcset=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.11.33-PM.png 746w, https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-content\/uploads\/2021\/10\/Screen-Shot-2021-10-17-at-3.11.33-PM-274x300.png 274w\" sizes=\"(max-width: 709px) 85vw, (max-width: 909px) 67vw, (max-width: 984px) 61vw, (max-width: 1362px) 45vw, 600px\"><\/figure><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>sketch \/\/Yanina Shavialenka \/\/Section B var n; var heartShape = []; var theta = 0; var nPoints = 55; function setup() { createCanvas(480, 480); } function draw() { background(map(mouseX, 0, width, 0, mouseY)); heartCurve(); epitrochoidCurve(); hypotrochoidCurve(); astroidCurve(); } function heartCurve() { \/\/https:\/\/mathworld.wolfram.com\/HeartCurve.html push(); fill(255, 153, 255); stroke(73, 84, 216); translate(width\/2, height\/2-35);\/\/changes (0,0) point to center … <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/2021\/10\/17\/curves-3\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> “Curves”<\/span><\/a><\/p>\n","protected":false},"author":670,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[108,56],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/67893"}],"collection":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/users\/670"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/comments?post=67893"}],"version-history":[{"count":3,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/67893\/revisions"}],"predecessor-version":[{"id":67903,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/posts\/67893\/revisions\/67903"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/media?parent=67893"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/categories?post=67893"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2021\/wp-json\/wp\/v2\/tags?post=67893"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}