The arc() function
The arc()
function is used whilst drawing paths to the canvas to draw
a circle or a partial circle to the canvas.
Arguments to the function
- The X coordinate (of the center point)
- The Y coordinate (of the center point)
- The radius of the arc/circle
- The angle to start drawing 1
- The angle to stop drawing at 1
- A boolean indicating the direction to draw. True is anti-clockwise, false is clockwise
1
Angles are measured in radians - not degrees. 1 radian is equal to
(180 / Math.PI)
degrees.
An example
<script>
window.onload = function ()
{
var canvas = document.getElementById('cvs');
var context = canvas.getContext)'2d');
context.beginPath();
// This draws a whole circle to the canvas
context.arc(125, 125, 100, 0, Math.PI * 2, false);
context.stroke();
}
</script>