p5(sketch => {
sketch.setup = function() {
sketch.createCanvas(canvas_width, canvas_height);
sketch.colorMode(sketch.HSB, 360, 100, 100, 100);
sketch.noStroke();
sketch.rect(0, 0, canvas_width, canvas_height);
sketch.noLoop();
};
sketch.draw = function() {
const background_colour = sketch.color(360);
sketch.background(background_colour);
sketch.blendMode(sketch.MULTIPLY);
for (var xy = 0; xy < grid[0].length; xy++) {
const background_grid = grid[0][xy];
const colour = sketch.color(background_grid.colour);
sketch.noFill();
sketch.stroke(colour);
sketch.rect(background_grid.x, background_grid.y, background_grid.r * 2, background_grid.r * 2);
}
for (var g = 0; g < grid[1].length; g++) {
const colour = sketch.color(grid[1][g].colour);
if (grid[1][g].stroke === true) {
sketch.stroke(colour);
sketch.noFill();
} else {
sketch.noStroke();
sketch.fill(colour);
}
sketch.ellipse(grid[1][g].x, grid[1][g].y, grid[1][g].r * 2);
}
}
})