Entrar Ainda não tem acesso?
1
resposta

Esquadro

por Jonas Daniel de Oliveira Junior
| 15.5k xp | 8 posts

Tenho uma duvida, no exercício o meu ficou diferente do que o professor colocou depois. Porém o que me deixou um pouco confuso foi o calculo que ele utilizou.

o meu ficou assim: 

<!-- esquadro.html -->

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

<script>

    var tela = document.querySelector('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= cor;
        pincel.beginPath();
        pincel.moveTo(xa, ya);
        pincel.lineTo(xa, yc);
        pincel.lineTo(xc, yc);
        pincel.fill();

    }

desenhaEsquadro(50, 50, 400, 400, 'black');
desenhaEsquadro(100, 175, 275, 350, 'white');




</script>

e o do estrutor ficou assim:

<script>

    var tela = document.querySelector('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((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();

}

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

</script>
1 resposta
por Andrieli Gonçalves
| 981.4k xp | 1973 posts
Alura Scuba Team Monitora Escola Semente | Fórum Ops

Oi, Jonas! Tudo certo?

Desde já, agradeço a paciência em aguardar uma resposta!

Existem diferentes maneiras de desenvolver um código. A forma utilizada pelo instrutor, por exemplo, deixa a construção do desenho mais dinâmica. Os números e as operações presentes nos cálculos foram escolhidos para que, ao substituir os valores das coordenadas xa, ya, xc e yc, o triângulo retângulo interno possuísse a metade das medidas do triângulo retângulo externo.

O dinamismo que apontei no inicio deve-se ao fato de que, independente dos valores passados como parâmetro para ilustração do esquadro, teremos como resultado uma relação de proporcionalidade entre as figuras.

Note que, na sua solução, os valores passados como parâmetro são concretos, ou seja, você mesmo analisou todas as coordenadas e as adicionou no programa — a sua ideia é diferente, mas também está correta! A questão é que, nestes casos, precisamos pensar um pouco mais nos valores, ao passo que, no código feito pelo instrutor, o cálculo para formação do esquadro é feito automaticamente!

Caso surja alguma dúvida durante os seus estudos, sinta-se confortável para enviá-la no fórum, Jonas! Ficarei feliz em te ajudar.

Até mais!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado! ✓.