Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

O cálculo está certo?

Referente ao curso JavaScript e HTML: pratique lógica com desenhos, animações e um jogo, no capítulo Extraindo funções e atividade Esquadro #2

por David Eler
| 48.6k xp | 10 posts
<meta charset="utf-8">
<canvas id="canvas" width="700" height="500"></canvas>

<script>

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

    function desenhaEsquadro(xa, ya, xc, yc, cor) {
        pincel.fillStyle = cor;
        pincel.beginPath();
        pincel.moveTo(xa, ya);
        pincel.lineTo(xa, yc);
        pincel.lineTo(xc, yc);
        pincel.fill();

        pincel.fillStyle = "white";
        pincel.beginPath();
        pincel.moveTo(2 * xa, (xa / 2) * 8);
        pincel.lineTo(2 * xa, (yc / 8) * 7);
        pincel.lineTo((xc / 16) * 11, (yc / 8) * 7);
        pincel.fill();
    }

    desenhaEsquadro(50, 50, 400, 400, "black");

</script>
2 respostas
por Cida Silveira
| 57.6k xp | 41 posts
Owner 
Esta e a formula matematica para gerar o tringula do meio.

function desenhaEsquadro(xa, ya, xc, yc, cor) {

pincel.fillStyle = cor
pincel.beginPath();
pincel.moveTo(xa, ya);
pincel.lineTo(xa,yc);
pincel.lineTo(xc, yc);
pincel.fill();

pincel.fillStyle = 'white'
pincel.beginPath();
pincel.moveTo((6*xa + xc)/7, (9*ya + 5*yc)/14);
pincel.lineTo((6*xa + xc)/7,(ya + 6*yc)/7);
pincel.lineTo((5*xa + 9*xc)/14, (ya + 6*yc)/7);
pincel.fill();

}

solução!
por Cássio Murilo
| 1276.7k xp | 2204 posts
Instrutor Agile Master

Fala, David! Tudo bem contigo?

Eu faria somente uma alteração em (xc / 16) * 11 para (xc / 16) * 10. Acredito que fica alinhado ;-)

pincel.fillStyle = "white";
pincel.beginPath();
pincel.moveTo(2 * xa, (xa / 2) * 8);
pincel.lineTo(2 * xa, (yc / 8) * 7);
pincel.lineTo((xc / 16) * 10, (yc / 8) * 7);
pincel.fill();

Faça esse teste!!!

Parabéns por ter encontrado outro caminho e compartilhado conosco!!!

Um abraço e bons estudos, David!