<canvas width="600" height="400"></canvas>
<script>
function dibujarCuadradoVerde(x,y,color){
var pantalla = document.querySelector("canvas");
var pincel= pantalla.getContext("2d");
pincel.fillStyle = color;
pincel.fillRect(x,y,50,50);
pincel.strokeStyle="black";
pincel.strokeRect(x,y,50,50);
}
for(var x=0; x<=600; x+=50){
for(var y=0; y<=400; y+=50){
if(y<50 || (y>=250 && y<300)){
dibujarCuadradoVerde(x,y,"blue");
}
if((y>=50 && y<100)|| (y>=200 && y<250) ){
dibujarCuadradoVerde(x,y,"white");
}
if(y>=100 && y<200){
dibujarCuadradoVerde(x,y,"red");
}
}
}
</script>
¡Hola! Comparto este pequeño código que me ayudo a dibujar la bandera de mi país, si tienen alguna idea de mejora, la aceptaré con gusto.
Saludos.
