Draw a standalone arc

ctx.beginPath();

ctx.arc(, , , *Math.PI/180, *Math.PI/180, );

;

If the current path has no subpaths, the arc() function creates a new subpath with two points: the start point of the arc and the end point of the arc.

The arc is centered at (000, 000) with a radius of 000.

The start point of the arc is at 000° and the end point is at 000°, and the direction of the arc is clockwise.

Draw the arc on the <canvas> by either stroking the path using the current stroke and line styles, or filling the path using the current fill style.

Add an arc to an existing subpath

ctx.beginPath();

ctx.moveTo(, );

ctx.arc(, , , *Math.PI/180, *Math.PI/180, );

;

However, if the current path already has a subpath, the arc() function adds the start point of the arc and the end point of the arc to the existing subpath, and the arc’s start point will be connected to the existing subpath with a straight line.