No termino de entender como hacemos el trazo final de la escuadra (la hipotenusa). Agradezco si alguien me ayuda a entenderlo, gracias :)
<canvas
width = "600"
height = "400"
>
</canvas>
<script>
var pantalla = document.querySelector("canvas");
var pincel = pantalla.getContext("2d");
pincel.fillStyle='black';
pincel.beginPath(); //iniciamos trazo con el pincel
pincel.moveTo(50, 50); // posicion inicial del pincel (x = 50 ; y = 50 )
pincel.lineTo(50, 400); // pincel baja por el eje Y (x = 50 ; y 400)
pincel.lineTo(400, 400); // pincel se desplaza a la derecha por el eje x (x = 400; y = 400)
pincel.fill(); //desconozco que hace
pincel.fillStyle='white'; //hacemos lo mismo que con el triangulo negro pero a menor escala y dentro del primero triangulo
pincel.beginPath();
pincel.moveTo(100, 175);
pincel.lineTo(100, 350);
pincel.lineTo(275, 350);
pincel.fill();
pincel.beginPath(); // desconozco que hacemos
pincel.moveTo(50, 50);
pincel.lineTo(50, 400);
</script>