Courbes HTML Canvas

Exemple

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

Essayez-le vous-même

Méthode arc()

Un arc de cercle est une partie d'un cercle, défini par les coordonnées du centre et le rayon :

Dessiner un arc de cercle sur le Canvas

Utilisez le chemin du canevas pour dessiner un arc de cercle :

Pour dessiner un cercle sur le canevas, utilisez les méthodes suivantes :

• beginPath() - Commencer un chemin
• arc(x,y,r,start,end) - Définir le cercle
• stroke() - Dessiner

arc(x,y,r,start,end) - Créer un arc (curve).

Pour créer un cercle, définissez l'angle de départ à 0 et l'angle de fin à 2 * Math.PI.

Les paramètres x et y définissent les coordonnées du centre du cercle.

Le paramètre r définit le rayon du cercle.

Veuillez également consulter :

Manuel complet Canvas de CodeW3C.com