let debug = false, viewPort = {x: 0, y: 0, v: 0}; let positions = [], triangles = [], squares = [], curves = [], algorithm = ""; function setup(){ setFrameRate(240); let c = createCanvas($("#canvasHolder").width(), $("#canvasHolder").height()); c.parent("canvasHolder"); background(0); stroke(255); strokeWeight(1); } function draw(){ background(0); if (algorithm == "chaos"){ stroke(255); if (points.length < 15000) for (let i = 0; i < 5; i++) points.push(p5.Vector.add(points[int(random(3))], points[points.length - 1]).div(2)); for (let p of points) point(p.x, p.y); } if (algorithm == "classic"){ fill(255); let tr = triangles[0]; triangle(tr.a.x, tr.a.y, tr.b.x, tr.b.y, tr.c.x, tr.c.y); fill(0); for (let t of triangles){ if (triangles.indexOf(t) == 0) continue; triangle(t.a.x, t.a.y, t.b.x, t.b.y, t.c.x, t.c.y); } } if (algorithm == "carpet"){ fill(255); let sq = squares[0]; rect(sq.center.x - sq.length / 2, sq.center.y - sq.length / 2, sq.length, sq.length); fill(0) for (let s of squares){ if (squares.indexOf(s) == 0) continue; rect(s.center.x - s.length / 2, s.center.y - s.length / 2, s.length, s.length); } } if (algorithm == "curve"){ fill(255); let c1 = curves[0]; rect(c1.center.x - c1.length / 2, c1.center.y - c1.length / 2, c1.length, c1.length); noFill(); stroke(0); for (let c of curves){ if (curves.indexOf(c) == 0) continue; beginShape(); for (let s in c){ if (!c.hasOwnProperty(s)) continue; for (let p in c[s]){ if (!c[s].hasOwnProperty(p)) continue; vertex(c[s][p].x, c[s][p].y); } } vertex(c.a.a.x, c.a.a.y); endShape(); } } if (debug) debugInformation(); } function startSierspinski(){ let alg = $("input[name=algorithm]:checked", "form").val(); let a = createVector(width / 2, 50), b = createVector(width / 2 - (height - 100) * sin(radians(30)) / sin(radians(60)), height - 50), c = createVector(width / 2 + (height - 100) * sin(radians(30)) / sin(radians(60)), height - 50); let center = createVector(width / 2, height / 2), length = height * 0.9 > width ? width * 0.9 : height * 0.9; switch (alg){ case "chaos": points = [a, b, c]; break; case "classic": triangles = [{a: a, b: b, c: c}]; spTriangle(a, b, c); break; case "carpet": squares = [{center: center, length: length}]; spCarpet(center, length / 3, 0); break; case "curve": curves = [{center: center, length: length}]; spCurve(center, length); break; } algorithm = alg; } function spTriangle(p1, p2, p3){ if (dist(p1.x, p1.y, p2.x, p2.y) > 7){ let newP1 = p5.Vector.add(p1, p2).div(2); let newP2 = p5.Vector.add(p1, p3).div(2); let newP3 = p5.Vector.add(p3, p2).div(2); triangles.push({a: newP1, b: newP2, c: newP3}); window.setTimeout(function(){spTriangle(p1, newP1, newP2);}, 300); window.setTimeout(function(){spTriangle(newP1, p2, newP3);}, 300); window.setTimeout(function(){spTriangle(newP2, newP3, p3);}, 300); } } function spCarpet(center, length, counter){ if (counter < 5){ squares.push({center: center, length: length}); for (let i = 0; i < TWO_PI; i += QUARTER_PI){ let dispo = createVector(sin(i), -cos(i)); if (i % HALF_PI == QUARTER_PI) dispo.mult(length * sqrt(2)); else dispo.mult(length); let newCenter = p5.Vector.add(center, dispo); window.setTimeout(function(){spCarpet(newCenter, length / 3, counter + 1)}, 500); } } } function spCurve(center, length){ if (length > 50){ let centerA = createVector(center.x - length / 4, center.y - length / 4), centerB = createVector(center.x + length / 4, center.y - length / 4), centerC = createVector(center.x + length / 4, center.y + length / 4), centerD = createVector(center.x - length / 4, center.y + length / 4); let newLength = sqrt(pow(length / 2, 2)); let sa = {a: createVector(center.x - length / 4, center.y - length / 8), b: createVector(center.x - length / 8 * 3, center.y - length / 4), c: createVector(center.x - length / 4, center.y - length / 8 * 3), d: createVector(center.x - length / 8, center.y - length / 4)}, sb = {a: createVector(center.x + length / 8, center.y - length / 4), b: createVector(center.x + length / 4, center.y - length / 8 * 3), c: createVector(center.x + length / 8 * 3, center.y - length / 4), d: createVector(center.x + length / 4, center.y - length / 8)}, sc = {a: createVector(center.x + length / 4, center.y + length / 8), b: createVector(center.x + length / 8 * 3, center.y + length / 4), c: createVector(center.x + length / 4, center.y + length / 8 * 3), d: createVector(center.x + length / 8, center.y + length / 4)}, sd = {a: createVector(center.x - length / 8, center.y + length / 4), b: createVector(center.x - length / 4, center.y + length / 8 * 3), c: createVector(center.x - length / 8 * 3, center.y + length / 4), d: createVector(center.x - length / 4, center.y + length / 8)}; curves.push({a: sa, b: sb, c: sc, d: sd}); window.setTimeout(function(){spCurve(centerA, newLength);}, 1000); window.setTimeout(function(){spCurve(centerB, newLength);}, 1000); window.setTimeout(function(){spCurve(centerC, newLength);}, 1000); window.setTimeout(function(){spCurve(centerD, newLength);}, 1000); } }