Método HTML canvas arc()

Crear un círculo:

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.arc(100, 75, 50, 0, 2 * Math.PI);
ctx.stroke();

Compatibilidad con navegador

Los números en la tabla especifican la primera versión del navegador que soporta totalmente este método.

Method
arc()	Yes	9.0	Yes	Yes	Yes

El método arc() crea un arco/curva (utilizado para crear círculos o partes de círculos).

Sugerencia: para crear un círculo con arc(): establezca el ángulo inicial en 0 y el ángulo final en 2*Math.PI.

Sugerencia: use el método stroke() o fill() para dibujar el arco en el lienzo.

Centrar

arc( 100,75 ,50,0*Math.PI,1.5*Math.PI)

Ángulo inicial

arco(100,75,50, 0 , 1,5*Math.PI)

Ángulo final

arc(100,75,50,0*Math.PI, 1.5*Math.PI )

Sintaxis de JavaScript:	contexto .arc( x,y,r,sAngle,eAngle,antihorario );

Parameter	Description	Play it
x	The x-coordinate of the center of the circle
y	The y-coordinate of the center of the circle
r	The radius of the circle
sAngle	The starting angle, in radians (0 is at the 3 o'clock position of the arc's circle)
eAngle	The ending angle, in radians
counterclockwise	Optional. Specifies whether the drawing should be counterclockwise or clockwise. False is default, and indicates clockwise, while true indicates counter-clockwise.