HTML 캔버스 arc() 메서드

원 만들기:

자바스크립트:

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 )

자바스크립트 구문:	컨텍스트 .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.