Cercles HTML Canvas

Exemple

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

Essayez-le vous-même

Dessiner un 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, configurez 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.

La définition de r indique le rayon du cercle.

Veuillez également consulter :

Manuel complet de référence Canvas de CodeW3C.com