Dúvida no exercício 11 Esquadro #2

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

<script>

    var tela = document.querySelector('canvas');
    var pincel = tela.getContext('2d');



    function letra(x1, y1, x2, y2, x3, y3){
        var texto = ['A', 'B', 'C'];
        var cordenadas = [[x1, y1], [x2, y2], [x3, y3]];
        for(var i = 0; i < 3; i++){
            pincel.font ='50px Arial';
            pincel.fillStyle = 'red';   
            if(i == 0){
                pincel.fillText(texto[i], (cordenadas [i][0] ) - 40, (cordenadas [i][1]) - 10);
            }else{
                pincel.fillText(texto[i], (cordenadas [i][0] ) - 40, (cordenadas [i][1]) + 50);
            }
        }       
    }                       //(x1, y1, x1, y3, x3, y3)
    function cordenadasExternas(x1, y1, x2, y2, x3, y3){
        var texto1 = x1.toString();//'50'
        var texto2 = y1.toString();//'50'
        var texto3 = x2.toString();//'50'
        var texto4 = y2.toString();//'400'
        var texto5 = x3.toString();//'400'
        var texto6 = y3.toString();//'400'

        var cordenadas1 = `(${texto1}, ${texto2} )`
        var cordenadas2 = `(${texto3}, ${texto4} )`
        var cordenadas3 = `(${texto5}, ${texto6} )`

        var texto = [cordenadas1, cordenadas2, cordenadas3];

        var cordenadas = [[x1, y1], [x2, y2], [x3, y3]];
        for(var i = 0; i < 3; i++){
            pincel.font ='25px Arial';
            pincel.fillStyle = 'black'; 
            if(i == 0 ){
                pincel.fillText(texto[i], (cordenadas [i][0] ) - 4, (cordenadas [i][1]) - 18);
            }else{
                pincel.fillText(texto[i], (cordenadas [i][0] ) - 4, (cordenadas [i][1]) + 38); 

            }
        }       
    }
    function cordenadasInternas(x1, y1, x2, y2, x3, y3){
        var texto1 = x1.toString();
        var texto2 = y1.toString();
        var texto3 = x2.toString();
        var texto4 = y2.toString();
        var texto5 = x3.toString();
        var texto6 = y3.toString();

        var cordenadas1 = `(${texto1}, ${texto2} )`
        var cordenadas2 = `(${texto3}, ${texto4} )`
        var cordenadas3 = `(${texto5}, ${texto6} )`

        var texto = [cordenadas1, cordenadas2, cordenadas3];

        var cordenadas = [[x1, y1], [x2, y2], [x3, y3]];
        for(var i = 0; i < 3; i++){
            pincel.font ='25px Arial';
            pincel.fillStyle = 'green'; 
            if(i == 0 ){
                pincel.fillText(texto[i], (cordenadas [i][0] )- 4, (cordenadas [i][1]) - 18);           
            }else{
                pincel.fillText(texto[i], (cordenadas [i][0] )- 4, (cordenadas [i][1]) + 60);
            }
        }       
    }

    function esquadro(x1, y1, x3, y3){
        letra(x1, y1, x1, y3, x3, y3);
        cordenadasExternas(x1, y1, x1, y3, x3, y3);
        cordenadasInternas((6*x1 + x3)/7, (9*y1 + 5*y3)/14, (6*x1 + x3)/7, (y1 + 6*y3)/7, (5*x1 + 9*x3)/14, (y1 + 6*y3)/7);

        pincel.fillStyle = 'black';
        pincel.beginPath()
        pincel.moveTo(x1, y1);
        pincel.lineTo(x1, y3);
        pincel.lineTo(x3, y3);
        pincel.fill();

        pincel.fillStyle = 'white';
        pincel.beginPath();
        pincel.moveTo((6*x1 + x3)/7, (9*y1 + 5*y3)/14,);
        pincel.lineTo((6*x1 + x3)/7, (y1 + 6*y3)/7);
        pincel.lineTo((5*x1 + 9*x3)/14, (y1 + 6*y3)/7);
        pincel.fill();
    }

    esquadro(50, 50, 400, 400);


</script>