Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Plano cartesiano canvas

Referente ao curso JavaScript e HTML: pratique lógica com desenhos, animações e um jogo, no capítulo Desenhando gráficos com Canvas e atividade Nossa primeira obra de arte. Será?

por Diego Dias Marques
| 214.7k xp | 168 posts

Na hora de criar o retângulo vermelho as coordenadas podem ser (400, 0, 600, 400) ao invés de (400, 0, 200, 400) ? Dá na mesma ou tem diferença ?

<canvas width="600" height="400"></canvas>

<script>
    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');


      pincel.fillStyle = 'lightgrey';
    pincel.fillRect (0, 0, 600, 400); 

    pincel.fillStyle = 'green';
    pincel.fillRect(0,0, 200, 400);

    pincel.fillStyle = 'red';
    pincel.fillRect(400, 0, 600, 400);




</script>
1 resposta
solução!
por Fernando Ramos
| 339.3k xp | 36 posts

Oi Vinicius, Funciona, mas não é o ideal...

Quando vc faz:

pincel.fillStyle = 'red';

pincel.fillRect(400, 0, 600, 400);

vc esta posicionando corretamente em X (valendo 400) .... mas vc está definindo 600 de largura.... como só tem 200 sobrando (pq vc iniciou em 400....... o total do canvas é 600.... logo 600 - 400 seria 200)...... ele preenche os 200 restante e ignora o resto...pq nao tem mais canvas (tela) para preencher....

Funciona....mas o correto é definir o espaço restante corretamente..... logo:

pincel.fillStyle = 'red';

pincel.fillRect(400, 0, 200, 400);