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?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas
respostas
Criação do esquadro
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 !