HTML Canvas cirkel

Eksempel

Din browser understøtter ikke HTML5 canvas tagget.
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.arc(95, 50, 40, 0, 2 * Math.PI);
ctx.stroke();

Prøv det selv

Tegn cirkel

For at tegne en cirkel på canvas, brug følgende metoder:

  • beginPath() - Start sti
  • arc(x,y,r,start,end) - Definer cirkel
  • stroke() - Tegn

arc(x,y,r,start,end) - Opret en bue (kurve).

For at oprette en cirkel, sæt startvinklen til 0 og slutvinklen til 2 * Math.PI.

x og y parametre definerer koordinaterne for cirkelens midte.

r parameter definerer cirkelens radius.

Se også:

CodeW3C.com's fulde Canvas reference manual