Curva de Canvas HTML

Ejemplo

const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(100, 50, 50, 0, Math.PI);
ctx.stroke();

Pruebe usted mismo

Método arc()

El arco es una parte del círculo, también definida por las coordenadas del centro y el radio:

Dibujar arco de Canvas

Utilice la ruta del lienzo para dibujar el arco del círculo:

Para dibujar un círculo en el lienzo, utilice los siguientes métodos:

• beginPath() - Comenzar una ruta
• arc(x,y,r,start,end) - Definir círculo
• stroke() - Dibujar

arc(x,y,r,start,end) - Crear un arco (curva).

Para crear un círculo, configure el ángulo de inicio en 0 y el ángulo de finalización en 2 * Math.PI.

Los parámetros 'x' y 'y' definen las coordenadas del centro del círculo.

El parámetro 'r' define el radio del círculo.

Vea también:

Manual de referencia completo de Canvas de CodeW3C.com