Método Canvas arcTo()

Definición y uso

arcTo() El método crea un arco o curva entre dos tangentes en el lienzo.

Consejo:Utilice stroke() El método dibuja un arco exacto en el lienzo.

Ejemplo

Crear un arco entre dos tangentes en el lienzo:

Su navegador no admite la etiqueta HTML5 canvas.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.beginPath();
ctx.moveTo(20,20);           // Crear punto de inicio
ctx.lineTo(100,20);          // Crear línea horizontal
ctx.arcTo(150,20,150,70,50); // Crear arco
ctx.lineTo(150,120);         // Crear línea vertical
ctx.stroke();                // Realizar el dibujo

Intente hacerlo usted mismo

Sintaxis

context.fillRect(x1,y1,x2,y2,r);

Valor del parámetro

Parámetro Descripción
x1 Coordenada x del punto de inicio del arco
y1 Coordenada y del punto de inicio del arco
x2 Coordenada x del punto final del arco
y2 Coordenada y del punto final del arco
r Radio del arco

Compatibilidad del navegador

Los números en la tabla indican la versión del navegador que admite completamente la propiedad.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Notas:Internet Explorer 8 y versiones anteriores no admiten el elemento <canvas>.