fractalkitty looking for math? fractalkitty.com

Mathober 2025

Stellations

#random#trig#grid#interactive#animation#math#geometry#symmetry#mathober

drawGridstellations


let t = 0;
let n = 25;
let g = 6;
function setup() {
  createCanvas(500, 500);
  background(255);
  describe(
    "a radial graph with stellated polygons symmetrically rotated to make a mandala - the grow and shrink dancing with a slow blur and a staticky feel to the canvas."
  );
  rectMode(CENTER);
  strokeWeight(0.5);
  strokeCap(SQUARE);
  g = random([3, 4, 5, 6, 7, 8, 10, 11, 12, 15]);
}

function draw() {
  background(245, 250, 255, 20);
  translate(width / 2, height / 2);
  stroke(100, 110, 120, 10);
  drawGrid();
  v = 0;
  t += 0.05;
  noFill();
  push();
  rotate(t / 100);
  stellations((width / 25) * 2.5, (width / 25) * sin(t / 10), 0, 5, 1);
  stellations((width / 25) * 1.5, (width / 25) * sin(t / 10), 0, 2, 1);
  stellations((width / 25) * 8, (width / 25) * sin(t / 10), PI / g, 8, 1);

  pop();
  noFill();
  stroke(100, 110, 120, 30);
  rect(0, 0, width / 1.02, width / 1.02);
  rect(0, 0, width / 1.04, width / 1.04);
}

function drawGrid() {
  for (let i = 0; i < n; i++) {
    rotate((2 * PI) / n);
    line(-width / 1.5, 0, width / 1.5, 0);
    circle(0, 0, (width / n) * 2 * i);
  }
  noStroke();
  for (let i = 0; i < 500; i++) {
    x = random(-width / 2, width / 2);
    y = random(-width / 2, width / 2);
    fill(245, 250, 255, 150);
    circle(x, y, 2);
  }
}

function mousePressed() {
  setup();
  draw();
}

function stellations(r1, r2, r3, a, b) {
  push();
  rotate(r3);
  for (let j = 0; j < g; j++) {
    rotate(PI / (g / 2));
    fill(80, 90, 100, 10);
    beginShape();
    for (let i = 0; i < g; i++) {
      x = r1 * cos((i * PI) / (g / 2));
      y = (width / 25) * a + r2 * sin((i * PI) / (g / 2));
      vertex(x, y);
      strokeWeight(0.5);
      stroke(120, 130, 140, 100);
      line(x, y, 0, width / 5 + (width / 25) * 8 * sin(t / 10) * cos(t / 15));
    }
    endShape(CLOSE);
  }
  pop();
}