Skip to content
Advertisement

Draw isocele triangle according to angle in javascript canvas

I would like to know how can I draw an isocele triangle in canvas, if I know the first angle, and the lengths of the two equal side.

Shema (known lengths are in red)

And second question, is it possible to curve the top side like that :

Shema

Answer

var canvas = document.getElementById("canvas");
canvas.width = 500;
canvas.height = 500;
 
var ctx = canvas.getContext("2d");
   ctx.closePath();
    ctx.save();

function drawPie(ctx,centerX, centerY, radius, startAngle, endAngle ){
    
        ctx.beginPath();
        ctx.moveTo(centerX,centerY);
        ctx.arc(centerX, centerY, radius, startAngle, endAngle);
        ctx.closePath();
        ctx.stroke();
    }

drawPie(ctx, 200,200,200,  -0.65*Math.PI, -0.60* Math.PI + Math.PI/4);
 <canvas id="canvas"></canvas>
Advertisement