HTML-Canvas -arc()- Methode

Kreis erstellen:

JavaScript:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.arc(100, 75, 50, 0, 2 * Math.PI);
ctx.stroke();

Browser-Unterstützung

Die Zahlen in der Tabelle geben die erste Browserversion an, die das Verfahren vollständig unterstützt.

Method
arc()	Yes	9.0	Yes	Yes	Yes

Die arc()-Methode erstellt einen Bogen/eine Kurve (wird verwendet, um Kreise oder Teile von Kreisen zu erstellen).

Tipp: Um einen Kreis mit arc() zu erstellen: Setzen Sie den Startwinkel auf 0 und den Endwinkel auf 2*Math.PI.

Tipp: Verwenden Sie die Methode stroke() oder fill() , um den Bogen tatsächlich auf der Leinwand zu zeichnen.

Center

arc( 100,75 ,50,0*Math.PI,1.5*Math.PI)

Startwinkel

arc(100,75,50, 0 ,1.5*Math.PI)

Endwinkel

arc(100,75,50,0*Math.PI, 1.5*Math.PI )

JavaScript-Syntax:	Kontext .arc( x,y,r,sAngle,eAngle,gegen den Uhrzeigersinn );

Parameter	Description	Play it
x	The x-coordinate of the center of the circle
y	The y-coordinate of the center of the circle
r	The radius of the circle
sAngle	The starting angle, in radians (0 is at the 3 o'clock position of the arc's circle)
eAngle	The ending angle, in radians
counterclockwise	Optional. Specifies whether the drawing should be counterclockwise or clockwise. False is default, and indicates clockwise, while true indicates counter-clockwise.