Boa noite! Quando li o exercício, não entendi que deveria encontrar uma forma de calcular a espessura do esquadro para a solução. Assim, eu imaginei que tínhamos somente que fazer o desenho, utilizando a função. A forma mais simples que encontrei foi através de listas, visto que as coordenadas já estavam indicadas. Confesso que depois que li a resposta 'oficial' tive que recorrer ao fórum para entender, pois não sou muito familiarizado com essas fórmulas de geometria. Na verdade não posso dizer que entendi plenamente o que foi feito, mas acho que consigo ver o caminho utilizado. De qualquer forma, segue o meu código:
<!-- esquadro.html -->
<canvas width="600" height="400"></canvas>
<script>
function desenhaEsquadro(xa, ya, xc, yc, cor) {
var tela = document.querySelector('canvas');
var pincel = tela.getContext('2d');
for(var i = 0; i < cor.length; i++){
pincel.fillStyle=cor[i];
pincel.beginPath();
pincel.moveTo(xa[i], ya[i]);
pincel.lineTo(xa[i], yc[i]);
pincel.lineTo(xc[i], yc[i]);
pincel.fill();
}
}
var cor = ['black', 'white'];
var xa = [50, 100];
var ya = [50, 175];
var xc = [400, 275];
var yc = [400, 350];
desenhaEsquadro(xa, ya, xc, yc, cor);
</script>
