xxxxxxxxxx
68
/*
l'idée c'est de mettre des cercles de la même couleur sur ou sous des bandes de couleurs différentes. Et alors des cercles de même couleur apparaissent différents
inspiré de https://munker-illusion--jgordon510.repl.co/
Voir aussi https://confetti-munker.glitch.me/
Voir aussi https://p5js.org/examples/simulate-stepping-feet-illusion.html
Et aussi https://io9.gizmodo.com/the-munker-illusion-destroys-your-faith-in-color-5907175
*/
var cercles = 10;
var cercleSize = 100;
var colors = ['red', 'green', 'blue'];
var lineWidth = 10;
var k ;
function setup() {
createCanvas(windowWidth, windowHeight);
frameRate(2) ;
noStroke() ;
}
function draw() {
background(0);
k = int(random( colors.length )) ;
print(k) ;
drawBands( k ) ;
for (var i = 0; i < cercles; i++) {
faireCercle(i);
}
k = (k+1) % colors.length ;
print(k) ;
drawBands( k ) ;
k = (k+1) % colors.length ;
print(k) ;
drawBands( k ) ;
}
function faireCercle(i) {
var rayon = random(cercleSize/3, cercleSize) ;
var posX = random ( rayon/2 + 10, height - ( rayon/2 + 10 ) ) ;
var posY = random ( rayon/2 + 10, height - ( rayon/2 + 10 ) ) ;
// var n = i % colors.length ;
// fill( colors[n] ) ;
fill('tan');
ellipse( posX, posY, rayon ) ;
}
function drawBands( i ) {
if( i > colors.length ) {
print(i, "i doit être inférieur ou = au nb de couleurs" ) ;
}
var currentColor = colors[i] ;
fill(currentColor);
for (var y = 0; y < height; y += lineWidth) {
rect(0, y + i * lineWidth / colors.length, width, lineWidth / colors.length);
}
}