fractalkitty looking for math? fractalkitty.com

all

moiré strings

#random#trig#interactive#animation#polar

let cnt;
let n = 8;
let r;
let r1, b1, g1;
function setup() {
  cnv = createCanvas((w = min(windowWidth, windowHeight) * 0.9), w);
  describe(
    "a string-art like structure made with curves that makes moire patterns as it animates. the mouse position changes the string positions."
  );
  background(40);
  angleMode(DEGREES);
  r = w / 2.4;
  noStroke();
  r1 = random(150, 200);
  g1 = random(150, 200);
  b1 = random(150, 230);
  h = int(random(1, 5));
  k = int(random(1, 5));
  s = random([20, 60, 120, 240]);
}
function draw() {
  s = 360 * sin(mouseX / 20);
  translate(w / 2, w / 2);

  t = frameCount / 20;
  background(r1, g1, b1);
  cnt = 0;

  for (let i = -360; i < 360; i += 1) {
    fill(r1 - 100 * sin(i - t), g1 - 100 * sin(i - t), b1 - 100 * sin(i - t));
    x = r * cos(i) * sin(i / h - t);
    y = r * sin(i / k) * cos(i / h - t);
    stroke(r1 - 100 * sin(i), g1 - 100 * sin(i), b1 - 100 * sin(i));
    strokeWeight(1);
    line(
      x,
      y,
      r * cos(i / k + s + t) * sin(i / h - t + s),
      r * sin(i / k + s + t)
    );
  }
}

function mousePressed() {
  r1 = random(150, 200);
  g1 = random(150, 200);
  b1 = random(150, 230);
  h = int(random(1, 5));
  k = int(random(1, 5));
  s = random([20, 60, 120, 240]);
}

function windowResized() {
  resizeCanvas((w = min(windowWidth, windowHeight) * 0.9), w);
  r = w / 2.4;
}