Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Criação do esquadro

Usamos duas vezes o pincel.lineTo(), então quer dizer que criamos duas linhas, certo? O esquadro é fechado com o comando pincel.fill(), sem a necessidade de adicionar mais um pincel.lineTo?

2 respostas
solução!

Oi Alexandre tudo bem?

Exatamente! O pincel.lineTo() usado duas vezes criou duas linhas e o triângulo é fechado com o pincel.fill() pois o canvas já tem 3 pontos para poder criar um polígono.

Espero ter ajudado!!!

Alexandre,

Independente de quantos lados tenha o seu poligono (pode ser um triangulo ou outro qualquer) , o último ponto sempre será ligado com o primeiro para "fechar" o poligono. Experimente fazer um poligono com mais lados do que um triangulo e não "fechar" a última linha.

<!DOCTYPE html>
<canvas width="600" height="400">
</canvas>

<script>

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

    pincel.fillStyle = 'black';
    pincel.beginPath ();
    pincel.moveTo(50,50);
    pincel.lineTo(50,200);
    pincel.lineTo(100,250);
    pincel.lineTo(150, 390); 
    pincel.lineTo(200, 250); 
    /* pincel.lineTo(50,50); */
    pincel.fill(); 

</script>

Note que a linha comentada, voltando ao ponto inicial, estaria "fechando" o desenho, mas não é necessária, pois o JS já o faz por si só.

Abraços, e bons estudos !