fractalkitty looking for math? fractalkitty.com

quilts

Hilbert quilt_plotter

#random#interactive#svg#pen-plotter#geometry#truchet#home

cArrayuniquePathsrunHilbertSequenceoriginalTrianglematrixcurrentStrokepathKeydrawUniquePathspathround6truchetblock1block2block3block4block5block6block7

let c1 = [120, 140, 205];
let c2 = 255;
let cArray;
let uniquePaths = new Map();

function setup() {
  w = 800;
  cArray = [];
  cnv = createCanvas(w, w, SVG);

  for (let i = 0; i < 8; i++) {
    cArray[i] = random([c1, c2]);
  }
  background(255);
  noFill();
  uniquePaths.clear();
}

function draw() {
  clear();
  background(255);
  runHilbertSequence(true);
  clear();
  background(255);
  translate(w / 2, w / 2);
  drawUniquePaths();
  noLoop();
}

function runHilbertSequence(gatherMode) {
  if (gatherMode) {
    const originalTriangle = window.triangle;
    window.triangle = function (x1, y1, x2, y2, x3, y3) {
      const matrix = drawingContext.getTransform();
      const currentStroke = drawingContext.strokeStyle;

      const pathKey = `${round6(x1)},${round6(y1)},${round6(x2)},${round6(
        y2
      )},${round6(x3)},${round6(y3)},${currentStroke},${round6(
        matrix.a
      )},${round6(matrix.b)},${round6(matrix.c)},${round6(matrix.d)},${round6(
        matrix.e
      )},${round6(matrix.f)}`;

      if (!uniquePaths.has(pathKey)) {
        uniquePaths.set(pathKey, {
          points: [x1, y1, x2, y2, x3, y3],
          stroke: currentStroke,
          matrix: {
            a: matrix.a,
            b: matrix.b,
            c: matrix.c,
            d: matrix.d,
            e: matrix.e,
            f: matrix.f
          }
        });
      }
    };

    translate(w / 2, w / 2);
    block7(w);

    window.triangle = originalTriangle;
  } else {
    translate(w / 2, w / 2);
    block7(w);
  }
}

function drawUniquePaths() {
  for (const path of uniquePaths.values()) {
    push();
    drawingContext.setTransform(
      path.matrix.a,
      path.matrix.b,
      path.matrix.c,
      path.matrix.d,
      path.matrix.e,
      path.matrix.f
    );
    stroke(path.stroke);
    triangle(
      path.points[0],
      path.points[1],
      path.points[2],
      path.points[3],
      path.points[4],
      path.points[5]
    );
    pop();
  }
}

function round6(num) {
  return Math.round(num * 1000000) / 1000000;
}

function truchet(d1, a, b) {
  push();
  fill(a);
  stroke(a);
  triangle(-d1, -d1, -d1, d1, d1, d1);
  fill(b);
  stroke(b);
  triangle(-d1, -d1, d1, -d1, d1, d1);
  pop();
}

function block1(d) {
  push();
  translate(-d / 4, -d / 4);
  truchet(d / 4, cArray[0], cArray[1]);
  translate(0, d / 2);
  truchet(d / 4, cArray[2], cArray[3]);
  pop();
  push();
  translate(d / 4, d / 4);
  truchet(d / 4, cArray[4], cArray[5]);
  translate(0, -d / 2);
  truchet(d / 4, cArray[6], cArray[7]);
  pop();
}

function block2(d) {
  push();
  scale(1 / 2, 1 / 2);
  push();
  translate(-w / 2, -w / 2);
  block1(d);
  translate(w, 0);
  scale(-1, 1);
  block1(d);
  pop();
  push();
  translate(-w / 2, w / 2);
  rotate(PI / 2);
  block1(d);
  pop();
  push();
  translate(w / 2, w / 2);
  rotate(-PI / 2);
  scale(-1, 1);
  block1(d);
  pop();

  pop();
}

function block3(d) {
  push();
  scale(1 / 2, 1 / 2);
  push();
  translate(-w / 2, -w / 2);
  block2(d);
  translate(w, 0);
  scale(-1, 1);
  block2(d);
  pop();
  push();
  translate(-w / 2, w / 2);
  rotate(PI / 2);
  block2(d);
  pop();
  push();
  translate(w / 2, w / 2);
  rotate(-PI / 2);
  scale(-1, 1);
  block2(d);
  pop();

  pop();
}

function block4(d) {
  push();
  scale(1 / 2, 1 / 2);
  push();
  translate(-w / 2, -w / 2);
  block3(d);
  translate(w, 0);
  scale(-1, 1);
  block3(d);
  pop();
  push();
  translate(-w / 2, w / 2);
  rotate(PI / 2);
  block3(d);
  pop();
  push();
  translate(w / 2, w / 2);
  rotate(-PI / 2);
  scale(-1, 1);
  block3(d);
  pop();

  pop();
}

function block5(d) {
  push();
  scale(1 / 2, 1 / 2);
  push();
  translate(-w / 2, -w / 2);
  block4(d);
  translate(w, 0);
  scale(-1, 1);
  block4(d);
  pop();
  push();
  translate(-w / 2, w / 2);
  rotate(PI / 2);
  block4(d);
  pop();
  push();
  translate(w / 2, w / 2);
  rotate(-PI / 2);
  scale(-1, 1);
  block4(d);
  pop();

  pop();
}

function block6(d) {
  push();
  scale(1 / 2, 1 / 2);
  push();
  translate(-w / 2, -w / 2);
  block5(d);
  translate(w, 0);
  scale(-1, 1);
  block5(d);
  pop();
  push();
  translate(-w / 2, w / 2);
  rotate(PI / 2);
  block5(d);
  pop();
  push();
  translate(w / 2, w / 2);
  rotate(-PI / 2);
  scale(-1, 1);
  block5(d);
  pop();

  pop();
}

function block7(d) {
  push();
  scale(1 / 2, 1 / 2);
  push();
  translate(-w / 2, -w / 2);
  block6(d);
  translate(w, 0);
  scale(-1, 1);
  block6(d);
  pop();
  push();
  translate(-w / 2, w / 2);
  rotate(PI / 2);
  block6(d);
  pop();
  push();
  translate(w / 2, w / 2);
  rotate(-PI / 2);
  scale(-1, 1);
  block6(d);
  pop();

  pop();
}

function keyPressed() {
  if (keyCode === 83) {
    save("hilbert.svg");
  }
  if (keyCode === 32) {
    setup();
    draw();
  }
}