1
resposta

Não consigo preencher o Canvas completamente

Olá, professor. Esse é o meu código:

meta charset="UTF-8" canvas width="600" height="400"> </canvas

script>

function desenhaQuadro(x,y,cor){

    var tela = document.querySelector("canvas");
    var pincel = tela.getContext("2d");

    pincel.fillStyle = cor;
    pincel.fillRect(x,y,50,50);

    pincel.fillStroke = "black";
    pincel.strokeRect(x,y,50,50);

};

for(var linha = 0; linha < 400; linha = linha + 50){
    for(var coluna = 0;coluna < 600; coluna = coluna + 50);
        desenhaQuadro(coluna,linha,"yellow");
}

Ao executá-lo, no entanto, só preenche os quadros e linhas referente ao x = 600 e y = 0, y + 40... até 400. É como se a variável 'coluna' não estivesse acumulando valor... pode me ajudar, por gentileza?

1 resposta

Olá Igor! Tudo bem? Como vai?

No código existe uma limitação que, por mais que você incremente valores para aumentar, tanto para X como para Y , eles estão travados em até 600 na width (largura) e 400 na height (altura).

Para que você possa expandir, precisa ampliar o seu canvas.

Feito isso, está resolvido!!!

Espero ter ajudado, Igor!

Bons estudos e vamos em frente!!!