este es el codigo que estubimos haciendo
<canvas width="600" height="400"></canvas>
<script>
function dibujarCuadradoVerde(x1,y1,color){
var pantalla = document.querySelector("canvas");
var pincel = pantalla.getContext("2d");
pincel.fillStyle = color ;
pincel.fillRect(x1,y1,50,50);
pincel.strokeStyle= "black";
pincel.strokeRect(x1,y1,50,50);
}
function numeroAleatorio(min, max) {
return Math.round(Math.random() * (max - min ) + min );
}
let colores = ["red","yellow","green","blue"];
for(var x = 0 ; x < 600 ; x = x + 50 ){
dibujarCuadradoVerde(x ,0,colores[numeroAleatorio(0,3)]);
dibujarCuadradoVerde(x ,50,colores[numeroAleatorio(0,3)]);
dibujarCuadradoVerde(x ,100,colores[numeroAleatorio(0,3)]);
dibujarCuadradoVerde(x ,150,colores[numeroAleatorio(0,3)]);
}
/*
var x = 0;
var y = 0;
while( x < 600 ){
dibujarCuadradoVerde(x ,0,colores[numeroAleatorio(0,3)]);
dibujarCuadradoVerde(x ,50,colores[numeroAleatorio(0,3)]);
dibujarCuadradoVerde(x ,100,colores[numeroAleatorio(0,3)]);
dibujarCuadradoVerde(x ,150,colores[numeroAleatorio(0,3)]);
x = x + 50;
}
*/
/*
dibujarCuadradoVerde(x ,50,colores[numeroAleatorio(0,3)]);
dibujarCuadradoVerde(x ,100,colores[numeroAleatorio(0,3)]);
*/
</script>