HTML5 Canvas Arcs
Use Canvas methods to draw arcs of different types and sizes.
Arc Method:arc(x, y, radius, startAngle, endAngle, direction)
To draw an arc on the canvas use method arc(x, y, radius, startAngle, endAngle, direction) .
1.Here (x, y) denote the centre of the arc.
2.radius :denotes the radius of the arc.
3.startAngle: Denotes the angle where the arc should begin.
4.endAngle: Denotes the angle where the arc ends.
5.direction: Specifies the direction along which the arc is to be created.It has two options clockwise and anticlockwise, the default is clockwise.
Example:Arc using method arc().Give it a TRY! » Exercise-Set the variable
counterClockwiseto false, to draw arc in clockwise direction.
Arc Method:arcTo(x1, y1, x2, y2, radius).
1.The method arcTo(x1, y1, x2, y2, radius) creates an arc between the two tangents to circle with given radius.
2.Here, (x1, y1) and (x2, y2) denote the two points along which arc is to be created.
3.A circle of given radius is drawn which intersects the lines at two points ( t1 and t2), which are joined to create the arc. See Figure above.