A wall paper of metacircles!!!<\/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 * Project-05\n *\n * This program draws wallpapaer\n *\/\n\n\/\/set circle sizes\nvar sizeCircle=50;\n\n\nfunction setup() {\n createCanvas(600,600);\n background(255);\n}\n\nfunction draw() {\n\/\/array for the metacircles (both directions)\n for (var x=0; x<=width; x+=sizeCircle*2)\n {\n for (var y=0; y<=height; y+=sizeCircle*2)\n {\n metaCircle(x,y,sizeCircle);\n metaCircle2(x+sizeCircle,y+sizeCircle,sizeCircle);\n }\n }\n\n\/\/filling cirlces that cover the gap between shapes\n for (var x=sizeCircle; x<=width+sizeCircle; x+=sizeCircle*2)\n {\n for (var y=0; y<=height; y+=sizeCircle*2)\n {\n \/\/change color of strokes and fills\n fill(0);\n stroke(0);\n strokeWeight(sizeCircle\/8);\n circle(x,y,sizeCircle\/3);\n circle(x-sizeCircle,y+sizeCircle,sizeCircle\/3);\n }\n }\n\/\/noLoop() to prevent refreshing as the patterns is all ramdom\n noLoop();\n\n \n}\n\n\/\/ first type of metacircle\nfunction metaCircle(x,y,size,c) {\n \/\/set random values from 0 to 2 to get 3 different colors for the shape\n var guess = Math.floor(Math.random()*3);\n if (guess==0)\n {\n fill (255,125,125,255);\n }\n else if (guess==1)\n {\n fill (125,255,125,255);\n }\n else if (guess==2)\n {\n fill (125,125,255,255);\n }\n \/\/two circles as base\n strokeWeight(0);\n circle(x+size\/2,y-size\/2,size);\n circle(x-size\/2,y+size\/2,size);\n\n \/\/one rotated square fill the middle part \n rectMode(CENTER);\n push();\n translate(x,y);\n rotate(1\/4*Math.PI)\n rect(0,0,size\/2,size\/2);\n pop();\n\n \/\/drawing the outline with 4 arcs\n stroke(0);\n strokeWeight(size\/8);\n noFill();\n arc(x-size\/2, y-size\/2, size, size, 0, HALF_PI);\n arc(x+size\/2, y+size\/2, size, size, PI, PI+HALF_PI);\n arc(x+size\/2, y-size\/2, size, size, -PI, HALF_PI);\n arc(x-size\/2, y+size\/2, size, size, 0, PI+HALF_PI);\n\n \/\/patterns \n stroke(25);\n strokeWeight(size\/16);\n arc(x-size\/2, y+size\/2, size\/3*2, size\/3*2, 0, PI+HALF_PI);\n arc(x+size\/2, y-size\/2, size\/3*2, size\/3*2, -PI, HALF_PI);\n arc(x-size\/2, y+size\/2, size\/3, size\/3, 0, PI+HALF_PI);\n arc(x+size\/2, y-size\/2, size\/3, size\/3, -PI, HALF_PI);\n}\n\n\/\/second type of metacircle same as above (no further explanations)\nfunction metaCircle2 (x,y,size,c) {\n var guess = Math.floor(Math.random()*3);\n if (guess==0)\n {\n fill (255,125,125,255);\n }\n else if (guess==1)\n {\n fill (125,255,125,255);\n }\n else if (guess==2)\n {\n fill (125,125,255,255);\n }\n strokeWeight(0);\n circle(x+size\/2,y+size\/2,size);\n circle(x-size\/2,y-size\/2,size);\n rectMode(CENTER);\n push();\n translate(x,y);\n rotate(1\/4*Math.PI)\n rect(0,0,size\/2,size\/2);\n pop();\n\n stroke(0);\n strokeWeight(size\/8);\n noFill();\n arc(x-size\/2, y+size\/2, size, size, -HALF_PI, 0);\n arc(x+size\/2, y-size\/2, size, size, HALF_PI, PI);\n arc(x+size\/2, y+size\/2, size, size, -HALF_PI, PI);\n arc(x-size\/2, y-size\/2, size, size, HALF_PI, 2*PI);\n\n stroke(220);\n strokeWeight(size\/16);\n arc(x+size\/2, y+size\/2, size\/3*2, size\/3*2, -HALF_PI, PI);\n arc(x-size\/2, y-size\/2, size\/3*2, size\/3*2, HALF_PI, 2*PI);\n arc(x+size\/2, y+size\/2, size\/3, size\/3, 0, -HALF_PI, PI);\n arc(x-size\/2, y-size\/2, size\/3, size\/3, HALF_PI, 2*PI);\n}<\/code><\/pre><\/p><\/body><\/html>\n","protected":false},"excerpt":{"rendered":"<p>A wall paper of metacircles!!! \/* * Andrew J Wang * ajw2@andrew.cmu.edu * Section A * Project-05 * * This program draws wallpapaer *\/ \/\/set circle sizes var sizeCircle=50; function setup() { createCanvas(600,600); background(255); } function draw() { \/\/array for the metacircles (both directions) for (var x=0; x<=width; x+=sizeCircle*2) { for (var y=0; y<=height; y+=sizeCircle*2) … <a href=\"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/2022\/10\/01\/project-5-wallpaper-3\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> “Project 5: Wallpaper”<\/span><\/a><\/p>\n","protected":false},"author":768,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[104,55,1],"tags":[],"_links":{"self":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73395"}],"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=73395"}],"version-history":[{"count":2,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73395\/revisions"}],"predecessor-version":[{"id":73399,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/posts\/73395\/revisions\/73399"}],"wp:attachment":[{"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/media?parent=73395"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/categories?post=73395"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/courses.ideate.cmu.edu\/15-104\/f2022\/wp-json\/wp\/v2\/tags?post=73395"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}