HTML canvas arcTo() Method

Example

let c = document.getElementById("myCanvas");
let ctx = c.getContext("2d");

ctx.beginPath();
ctx.moveTo(25, 25);
ctx.lineTo(50, 10);
ctx.arcTo(75, 10, 75, 35, 25);
ctx.lineTo(75, 60);
ctx.stroke();

Try this code ❯

Meaning

The arcTo() method creates an arc/curve between two tangents.

Standard Syntax

JavaScript syntax:

context.arcTo(x1,y1,x2,y2,r);

Parameter Values

Parameter	Description
x1	Specifies the x-coordinate of the first tangent.
y1	Specifies the y-coordinate of the first tangent.
x2	Specifies the x-coordinate of the second tangent.
y2	Specifies the y-coordinate of the second tangent.
r	Specifies the radius of the arc.