var space = 5;

var lMargin = 25;

var uMargin = 25;

var rows = 10;

var cols = 10;

var chance = 25;

var grid = [];

​

function setup() {

  createCanvas(400, 400);

  for (var row = 0; row < rows; row++) {

    grid[row] = [];

    for (var col = 0; col < cols; col++) {

      grid[row][col] = 0;

    }

  }

}

​

function mousePressed() {

  for (var row = 0; row < rows; row++) {

    for (var col = 0; col < cols; col++) {

      if (random(chance) < 1) {

        grid[row][col] = 1;

      } else {

        grid[row][col] = 0;

      }

    }

  }

}

​

function draw() {

  background(255);

​

​

  for (var row = 0; row < rows; row++) {

    for (var col = 0; col < cols; col++) {

      if (grid[row][col] == 0) {

        fill(255 * row / rows, 255 * col / cols, 255);

        square(lMargin + col * (sideL + space), uMargin + row * (sideL + space), sideL);

      } else {

        fill(255 * row / rows, 255 * col / cols, 255);

        circle(lMargin + sideL / 2 + col * (sideL + space), uMargin + sideL / 2 + row * (sideL + space), sideL);

      }

    }

  }

}