Augmented Matrix

let t = 0;
let n = 25;
let randoms = [];

function setup() {
  createCanvas(500, 500);
  background(255);
  describe(
    "a matrix drawn on radial graph paper so that the lines are curved and the shape bow-tied, where instead of numbers there are circles. on the right there is an extra bar with different colored curcles to show augmentation."
  );
  rectMode(CENTER);
  strokeWeight(0.5);
  strokeCap(SQUARE);
  t = random(-10, 10);
  for (let i = 0; i < 100; i++) {
    randoms[i] = random(2, 10);
  }
}

function draw() {
  background(245, 250, 255, 20);
  translate(width / 2, height / 2);
  stroke(100, 110, 120, 10);
  drawGrid();
  t += 0.05;
  noFill();
  stroke(80, 90, 100);
  strokeWeight(3);
  arc(
    0,
    0,
    (width / 25) * 18,
    (width / 25) * 18,
    (PI / 50) * 40,
    (PI / 50) * 62
  );
  arc(
    0,
    0,
    (width / 25) * 18,
    (width / 25) * 18,
    (PI / 50) * 88,
    (PI / 50) * 110
  );
  strokeWeight(2);
  arc(
    0,
    0,
    (width / 25) * 12,
    (width / 25) * 12,
    (PI / 50) * 88,
    (PI / 50) * 110
  );
  cnt = 0;
  strokeWeight(0.5);

  for (let i = 0; i < 5; i++) {
    fill(40, 50, 60, 50);
    s = 43 + 4 * i;
    d = 8.5;
    for (let j = 0; j < 8; j++) {
      cnt++;
      d -= 1;
      circle(
        (width / 25) * d * cos((s * PI) / 50),
        (width / 25) * d * sin((s * PI) / 50),
        randoms[cnt] + 2 * cos(t)
      );
      if (j > 1) {
        circle(
          (-width / 25) * d * cos((s * PI) / 50),
          (width / 25) * d * sin((s * PI) / 50),
          randoms[cnt] + 2 * cos(t)
        );
      }
    }
    fill(200, 210, 220, 50);
    circle(
      (-width / 25) * 7.5 * cos((s * PI) / 50),
      (width / 25) * 7.5 * sin((s * PI) / 50),
      randoms[cnt] * 2 + 2 * cos(t)
    );
  }

  strokeWeight(1);
  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();
}