Manual de referencia HTML

Glosario de etiquetas HTML

Método arc() de HTML canvas

arc() es un método de Canvas 2Es un método de dibujo de arcos de API de Canvas. La trayectoria del arco tiene su centro en la posición (x, y), el radio es r, y se dibuja desde el startAngle (por defecto en sentido horario) hasta el endAngle.

Manual de referencia de canvas HTML

Ejemplo en línea

Dibujar un círculo:

Ejemplo

!DOCTYPE html>
<html>
<head>
<meta charset="utf-8>
<title>Uso del método arc() en HTML canvas-Tutoriales básicos(oldtoolbag.com)</<title>
</<head>
<body>
<canvas id="myCanvas" width="300" altura="150" estilo="borde:1px sólido #d3d3d3>
Su navegador no admite HTML5　etiqueta canvas.
</canvas>
<script>
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.arc(100,75,50,0,2*Math.PI);
ctx.stroke();
</script>　
</body>
</html>

Prueba y mira ‹/›

Compatibilidad del navegador

IEFirefoxOperaChromeSafari

Internet Explorer 9y Firefox, Opera, Chrome y Safari admiten arc() Método.

Nota:Internet Explorer 8 Las versiones anteriores a la 78 no admiten el elemento <canvas>.

Definición y uso

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

Consejo:Si deseas crear un círculo con arc(), realiza las siguientes operaciones: establece el ángulo inicial en 0, y el ángulo final en2 * Math.PI.

Consejo:Por favor usa stroke() ofill() El método dibuja el arco real en el lienzo.

Centro:

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)

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

Valor de parámetro

Parámetros	Descripción
x	Coordenada x del centro del círculo.
y	Coordenada y del centro del círculo.
r	Radio del círculo.
sAngle	Ángulo inicial, en radianes (la posición de las 3 en punto del círculo es 0 grados).
eAngle	Ángulo final, en radianes.
antihorario	Opcional. Define si se debe dibujar en sentido horario o antihorario. False = horario, true = antihorario.

Manual de referencia de canvas HTML

HTML: <template> etiqueta