Takawo: Step 4

function setup() {

  createCanvas(windowWidth, windowHeight);

  background(100);

  noLoop();

  noStroke();

}

​

function draw() {

  let d = 500;

  let diameterDecrement = d / 10;

  for (d = 500; d > 0; d -= 100) {

    let xArray = generateX();

    let yArray = generateY();

    let diameterDecrement = d / 10;

    drawCircles(xArray, yArray, d, diameterDecrement);

  }

}

​

function generateX() {

  let counter = 0;

  let xArray = [];

  while (counter < 20) {

    let x = random(0, windowWidth);

    xArray.push(x);

    counter++;

  }

  return xArray;

}

​

function generateY() {

  let counter = 0;

  let yArray = [];

  while (counter < 20) {

    let y = random(0, windowHeight);

    yArray.push(y);

    counter++;

  }

  return yArray;

}

​

function drawCircles(xArray, yArray, d, diameterDecrement) {

​

  for (let layerCounter = 0; d / diameterDecrement > 1; layerCounter++) {

    for (let i = 0; i < xArray.length; i++) {

      let xp = xArray[i];

      let yp = yArray[i];

      drawLayer(layerCounter, xp, yp, d);

    }

    d -= diameterDecrement;

  }

}

​

function drawLayer(layerCounter, xp, yp, d) {

  const palette = ["#92dce5", "#f7ec59",

    "#FFE9CE", "#FFB5C2",

    "#BFFFBC"

  ];

  fill(palette[layerCounter % 5]);

  circle(xp, yp, d);

}