{"id":73147,"date":"2022-09-26T15:21:51","date_gmt":"2022-09-26T19:21:51","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/?p=73147"},"modified":"2022-09-26T15:21:51","modified_gmt":"2022-09-26T19:21:51","slug":"project-04-string-art-18","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/26\/project-04-string-art-18\/","title":{"rendered":"Project 04 &#8211; String Art"},"content":{"rendered":"<!DOCTYPE html PUBLIC \"-\/\/W3C\/\/DTD HTML 4.0 Transitional\/\/EN\" \"http:\/\/www.w3.org\/TR\/REC-html40\/loose.dtd\">\n<html><body><div><a class=\"p5_sketch_link\" data-width=\"400\" data-height=\"300\" href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/uploads\/2022\/09\/sketch-398.js\">sketch<\/a><iframe src=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-content\/plugins\/p5-embedder\/p5_iframe.html\" class=\"p5_exampleFrame\" width=\"400\" height=\"300\"><\/iframe><pre class=\"language-javascript\"><code class=\"p5_editor language-javascript\">\/* eliana fleischer\n    efleisch\n    section e *\/ \n\n\/\/GLOBAL VARIABLES\n\/\/ these global variables will be used to be able to change the values while drawing different string arts\n    \nvar dx1;\nvar dx2;\nvar dy1;\nvar dy2;\n\nvar dx3;\nvar dy3;\nvar dx4;\nvar dy4;\n\nvar numLines1 = 50;\nvar numLines2 = 15;\n\nvar ax1 = 50;\nvar ax2 = 150;\nvar ay1 = 50;\nvar ay2 = 300; \n\nvar bx1 = 300;\nvar bx2 = 350;\nvar by1 = 300;\nvar by2 = 100;\n\n\nfunction setup() {\n    createCanvas(400, 300);\n    background(124,158,129);\n}\n\nfunction draw() {\n\n    push(); \/\/ push will create the bold deges of the lines\n    stroke(0);\n    strokeWeight(4);\n\n    ax1 = floor(random(15,200)); \/\/ randomize x values for the two lines\n    ax2 = floor(random(15,200));\n    bx1 = floor(random(200,385));\n    bx2 = floor(random(200,385));\n\n    ay1 = floor(random(15,150)); \/\/ randomize the y values for the two anchor lines\n    ay2 = floor(random(150,285));\n    by1 = floor(random(150,285));\n    by2 = floor(random(15,150));\n\n    line(ax1, ay1, ax2, ay2); \/\/ anchor line A \n    line(bx1, by1, bx2, by2); \/\/ anchor line B\n\n\n    dx1 = (ax2-ax1)\/numLines2; \/\/ creates dx and dy for the lines created divided by numLines\n    dx2 = (bx2-bx1)\/numLines2;\n    dy1 = (ay2-ay1)\/numLines2;\n    dy2 = (by2-by1)\/numLines2;\n\n\n    var x1 = ax1; \/\/ set the starting points of the string art lines to the anchor line values\n    var y1 = ay1;\n    var x2 = bx1;\n    var y2 = by1;\n\n    line(15,15, 385, 15); \/\/ upper anchor line\n    line(15,285,385,285); \/\/ lower anchor line\n\n    var x3 = 15; \/\/ creates the initial changing x values\n    var x4 = 385; \n    var x5 = 15;\n    var x6 = 385;\n\n    dx3 = (385-15)\/numLines1; \/\/ dx for the lines going to the left\n    dx4 = (15 - 385)\/numLines1; \/\/ dx for the lines going to the right\n\n\n    pop();\n\n\n    for (var i = 0; i &lt;= numLines1; i +=1){ \/\/ for loop making the background lines\n        stroke(243,204,113); \/\/ orange lines\n        line(15,15, x3, 285); \/\/ lines going to left\n\n        stroke(247,255,118); \/\/ yellow lines\n        line(385,15,x4,285); \/\/ lines going to the right\n\n        stroke(236,180,236); \/\/purple lines\n        line(15,285,x5,15); \/\/lines from the bottom going left\n\n        stroke(236,180,180); \/\/ pink lines\n        line(385,285,x6,15); \/\/ lines from the bottom going right\n\n\n        x3 += dx3; \/\/ changes the x values by the set dx\n        x4 += dx4;\n        x5 += dx3;\n        x6 += dx4\n    }\n\n    stroke(29,5,95);\n    strokeWeight(3)\n    for (var i = 0; i &lt;= numLines2; i+=1){\n        line(x1, y1, x2, y2); \/\/ uses the randomly generated points to start lines\n        x1 += dx1; \/\/ chnages the values by the set dxs and dys \n        y1 += dy1;\n        x2 += dx2;\n        y2 += dy2;\n    }\n    noLoop();\n}\n<\/code><\/pre><\/div>\n\n\n\n<p>I think the most difficult part of this project for me was creating an interesting image. I  did this by randomizing one of the string art shapes.<\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>sketch \/* eliana fleischer efleisch section e *\/ \/\/GLOBAL VARIABLES \/\/ these global variables will be used to be able to change the values while drawing different string arts var dx1; var dx2; var dy1; var dy2; var dx3; var dy3; var dx4; var dy4; var numLines1 = 50; var numLines2 = 15; var ax1 &hellip; <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/26\/project-04-string-art-18\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Project 04 &#8211; String Art&#8221;<\/span><\/a><\/p>\n","protected":false},"author":717,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[102,121],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73147"}],"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\/717"}],"replies":[{"embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/comments?post=73147"}],"version-history":[{"count":1,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73147\/revisions"}],"predecessor-version":[{"id":73149,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73147\/revisions\/73149"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=73147"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=73147"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=73147"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}