loop example

  3.18.2024

*/

function setup() {

  createCanvas(600, 400);

}

​

function draw() {

  background(220);

  fill(255);

  var x = 50;

  while (x <= 200) {

    ellipse(x, 100, 50);

    text(x, x, 100);

    x += 50;

  }

  for (var x = 0; x <= 400; x += 50) {

    ellipse(x, 200, 50);

    text(x, x, 200);

  }

  for (var y = 50; y < height; y += 50) {

    line(0, y, width, y);

  }

  for (var i = 0; i < 10; i++) {

    var x = i * 50;

    fill(255);

    circle(x, 300, 50);

    fill(0);

    text(i, x, 300);

    text(x, x, 300 + 10);

    // var s = 100 - i * 10;

    var s = map(i, 0, 9, 200, 50);

    var r = map(i, 0, 9, 0, 255);

    fill(r, 0, 0);

    circle(400, 100, s);

  }

}

​

​

​

​

​