HTML Referenzhandbuch

Vollständiges Verzeichnis der HTML-Tags

HTML canvas arc() Methode

arc() ist eine Canvas 2D API bietet eine Methode zum Zeichnen eines Bogenpfades. Der Mittelpunkt des Bogenpfades liegt an der Position (x, y), der Radius beträgt r, und der Bogen wird vom startAngle (standardmäßig im Uhrzeigersinn) beginnend und bis zum endAngle gezeichnet.

HTML canvas reference manual

Online-Beispiel

Zeichnen Sie einen Kreis:

Beispiel

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8>
<title>Verwendung des HTML canvas arc() Methods-Grund教程(oldtoolbag.com)</<title>
</<head>
<body>
<canvas id="myCanvas" width="300" height="150" style="border:1px fest #d3d3d3>
Ihr Browser unterstützt keine HTML5　canvas-Tag.
</canvas>
<script>
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.arc(100,75,50,0,2*Math.PI);
ctx.stroke();
</script>　
</body>
</html>

Testen Sie, ob ‹/›

Browserkompatibilität

IEFirefoxOperaChromeSafari

Internet Explorer 9und Safari unterstützen arc() Methode.

Hinweis:Internet Explorer 8 Versionen bis einschließlich und vorher unterstützen das <canvas>-Element nicht.

Definition und Verwendung

Die Methode arc() erstellt einen Bogen./curve (used to create a circle or part of a circle).

Tip:If you create a circle using arc(), perform the following operation: set the start angle to 0, and set the end angle to2 * Math.PI.

Tip:Please use stroke() orfill() Method to draw the actual arc on the canvas.

Center:

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

Start angle:

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

End angle:

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

JavaScript syntax:	context.arc(x,y,r,sAngle,eAngle,counterclockwise);

Parameter value

Parameter	Description
x	X-coordinate of the center of the circle.
y	Y-coordinate of the center of the circle.
r	Radius of the circle.
sAngle	Start angle, in radians (the circular three o'clock position is 0 degrees).
eAngle	End angle, in radians.
counterclockwise	Optional. Specifies whether the drawing should be drawn clockwise or counterclockwise. False = clockwise, true = counterclockwise.

HTML canvas reference manual

HTML: <template> Tag