HTML canvas arc() Method

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();

Soporte del navegador

Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con el método.

Método
arc()	4.0	9.0	3.6	4.0	10.1

El arc() método crea un arco / curva (used to create circles, or parts of circles) .

Tip: Para crear un círculo con arc() : Set ángulo inicial y el ángulo a 0 final a 2 * Math.PI.

Tip: Utilice el stroke() o el fill() método para dibujar realmente el arco en el lienzo.

Centrar

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

Ángulo inicial

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

ángulo final

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

la sintaxis de JavaScript:	context . arc( x,y,r,sAngle,eAngle,counterclockwise ) ;

Parámetro	Descripción	Juegalo
x	La coordenada x del centro del círculo	Juegalo "
y	La coordenada y del centro del círculo	Juegalo "
r	El radio del círculo	Juegalo "
sAngle	El ángulo de partida, en radianes (0 está en la posición tres de círculo del arco)	Juegalo "
eAngle	El ángulo que termina, en radianes	Juegalo "
counterclockwise	Opcional. Especifica si el dibujo debe ser hacia la izquierda o hacia la derecha. Falso es por defecto, e indica las agujas del reloj, mientras que la verdadera indica a la izquierda.	Juegalo "