Motion, Design, Art & Code
Published
Edited
May 12, 2019
p5(sketch => {
sketch.setup = function() {
sketch.createCanvas(960, 420);
sketch.background(0,0,33);
sketch.smooth();
sketch.noStroke();
sketch.rectMode(sketch.CENTER);
// the loop structure is made up of the following :
// - declaration of a variable with an initial value >>> int i=0;
// - a condition to test the variable >>> i<5000
// - increment or update of the variable as long as the test condition is true
// Then
// For as long as we are within the loop, the program executes what is within the main body
// i.e. between the curly brackets.
for (var i=0; i<5000; i++) {
var x = sketch.random(sketch.width); // generate a random x value
var y = sketch.random(sketch.height); // generate a random y value
var dia = sketch.random(1, 9); // generate a random value for modifying the circle's diameter
// we draw 5000 circles, each with a random position & size
sketch.ellipse(x, y, dia, dia);
}
};
sketch.draw = function() {};
})
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
