{"id":72793,"date":"2022-09-24T17:57:02","date_gmt":"2022-09-24T21:57:02","guid":{"rendered":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/?p=72793"},"modified":"2022-09-24T17:57:02","modified_gmt":"2022-09-24T21:57:02","slug":"project-4-string-art-2","status":"publish","type":"post","link":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/24\/project-4-string-art-2\/","title":{"rendered":"Project 4: String Art"},"content":{"rendered":"\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 draws line arts\n *\/\n\nvar maxNum = 30;\n\n\nfunction setup() {\n createCanvas(400, 300);\n background(0);\n}\n\nfunction draw() {\n background(0);\n \/\/using the 3 functions for 3 different shapes\n backgroundStrings (50);\n stroke(255);\n circleStrings(200,150,200,500);\n stroke(255,0,0,255);\n circleStrings(200,150,100,58);\n push();\n fill(255);\n ellipse(200,150,100);\n pop();\n stroke(255,0,0,255);\n hexagonStrings(200,150,100,5,10);\n \n}\n\nfunction circleStrings(Cx,Cy,Cd,Cl) {\n for (var k = 0; k < maxNum; k++)\n { \n \/\/grabing points on the circle\n y=sin((k*(360\/maxNum))*Math.PI\/180)*(Cd\/2)+Cy;\n x=cos((k*(360\/maxNum))*Math.PI\/180)*(Cd\/2)+Cx;\n \/\/making lines that is perpandicular to the radius with adjustable lengths\n p1X = x + cos(-(Math.PI\/2-(k*(360\/maxNum))*Math.PI\/180))*Cl;\n p1Y = y + sin(-(Math.PI\/2-(k*(360\/maxNum))*Math.PI\/180))*Cl;\n p2X = x - cos(-(Math.PI\/2-(k*(360\/maxNum))*Math.PI\/180))*Cl;\n p2Y = y - sin(-(Math.PI\/2-(k*(360\/maxNum))*Math.PI\/180))*Cl;\n line (p2X,p2Y,p1X,p1Y);\n }\n}\n\n\nfunction hexagonStrings(Hx,Hy,Hd,num,seg) {\n \/\/make arrays\n const array = [];\n var angle = 360\/num;\n for (var k = 0; k < num; k++)\n { \n array[k] = new Array();\n\n y=sin(-Math.PI\/2+(k*angle)*Math.PI\/180)*(Hd\/2)+Hy;\n x=cos(-Math.PI\/2+(k*angle)*Math.PI\/180)*(Hd\/2)+Hx;\n line (Hx,Hy,x,y);\n \n for (var s = 0; s<seg; s++)\n { \n \/\/3D array grabing every points on the line of the star\n array[k][s] = new Array();\n var y1=sin(-Math.PI\/2+(k*angle)*Math.PI\/180)*(Hd\/2)*s\/seg+Hy;\n var x1=cos(-Math.PI\/2+(k*angle)*Math.PI\/180)*(Hd\/2)*s\/seg+Hx;\n array[k][s][0] = x1;\n array[k][s][1] = y1;\n\n }\n }\n\n \/\/cross connecting those lines using for loop\n for (var k = 0; k < num-1; k++)\n {\n for (var s = 0; s<seg; s++)\n {\n line(array[k][s][0],array[k][s][1],array[k+1][seg-1-s][0],array[k+1][seg-1-s][1]);\n }\n }\n for (var s = 0; s<seg; s++)\n {\n line(array[num-1][s][0],array[num-1][s][1],array[0][seg-1-s][0],array[0][seg-1-s][1]);\n }\n\n}\n\nfunction backgroundStrings (num) {\n for (var k=0; k<num; k++)\n {\n \/\/cross connecting with for loop\n stroke(255\/num*k,0,0,255);\n line (k*width\/num,0,width,k*height\/num);\n line (width-k*width\/num,height,0,height-k*height\/num);\n line (k*width\/num,height,width,height-k*height\/num);\n line (width-k*width\/num,0,0,k*height\/num);\n }\n}<\/code><\/pre><\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>\/* * Andrew J Wang * ajw2@andrew.cmu.edu * Section A * * This program draws line arts *\/ var maxNum = 30; function setup() { createCanvas(400, 300); background(0); } function draw() { background(0); \/\/using the 3 functions for 3 different shapes backgroundStrings (50); stroke(255); circleStrings(200,150,200,500); stroke(255,0,0,255); circleStrings(200,150,100,58); push(); fill(255); ellipse(200,150,100); pop(); stroke(255,0,0,255); hexagonStrings(200,150,100,5,10); } function … <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/09\/24\/project-4-string-art-2\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> “Project 4: String Art”<\/span><\/a><\/p>\n","protected":false},"author":768,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[102,55,1],"tags":[86,79],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/72793"}],"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=72793"}],"version-history":[{"count":5,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/72793\/revisions"}],"predecessor-version":[{"id":72811,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/72793\/revisions\/72811"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=72793"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=72793"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=72793"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}