Метод дуги холста HTML

Создайте круг:

JavaScript:

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

Поддержка браузера

Цифры в таблице указывают на первую версию браузера, полностью поддерживающую метод.

Method
arc()	Yes	9.0	Yes	Yes	Yes

Метод arc() создает дугу/кривую (используется для создания кругов или частей кругов).

Совет. Чтобы создать окружность с помощью функции arc(): установите начальный угол равным 0, а конечный угол — равным 2*Math.PI.

Совет: используйте метод stroke() или fill() , чтобы на самом деле нарисовать дугу на холсте.

Центр

дуга( 100,75 ,50,0*Math.PI, 1.5*Math.PI)

Начальный угол

дуга(100,75,50, 0 ,1,5*Math.PI)

Конечный угол

дуга(100,75,50,0*Math.PI, 1.5*Math.PI )

Синтаксис JavaScript:	контекст .arc( x,y,r,sAngle,eAngle,против часовой стрелки );

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.