Boa noite,
Estou a tentar criar um tabuleiro tricolorido em javascript/canvas, tenho um tabuleiro de 400*400px de 8 por 8, com 60 casas. Agora preciso de pintá-lo com 3 cores diferentes, não necessitando de ter um sequência de cores, pode ser completamente aleatório, repetido etc. O código que tenho é o seguinte:
Código :
Pensei em criar um array com 3 cores, mas não estou a ver como vou pintar os quadrados do tabuleiro com as cores definidas no array, alguém me pode ajudar?
Estou a tentar criar um tabuleiro tricolorido em javascript/canvas, tenho um tabuleiro de 400*400px de 8 por 8, com 60 casas. Agora preciso de pintá-lo com 3 cores diferentes, não necessitando de ter um sequência de cores, pode ser completamente aleatório, repetido etc. O código que tenho é o seguinte:
Código :
main = function()
{
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
desenha_Tabuleiro(ctx);
}
function desenha_Tabuleiro(c)
{
c.beginPath();
c.rect(0, 0, 400, 400);
c.lineWidth = 1;
var colors = new Array ();
colors[0]="blue";
colors[1]="yellow";
colors[2]="red";
var i,j,a,b;
for(i=0; i<8; i++)
{
for(j=0; j<8; j++)
{
col=i*50;
r=j*50;
c.fillRect(col,r,50,50);
}
}
c.stroke();
c.closePath();
}
{
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
desenha_Tabuleiro(ctx);
}
function desenha_Tabuleiro(c)
{
c.beginPath();
c.rect(0, 0, 400, 400);
c.lineWidth = 1;
var colors = new Array ();
colors[0]="blue";
colors[1]="yellow";
colors[2]="red";
var i,j,a,b;
for(i=0; i<8; i++)
{
for(j=0; j<8; j++)
{
col=i*50;
r=j*50;
c.fillRect(col,r,50,50);
}
}
c.stroke();
c.closePath();
}
Pensei em criar um array com 3 cores, mas não estou a ver como vou pintar os quadrados do tabuleiro com as cores definidas no array, alguém me pode ajudar?