Canvas arc() 메서드
정의와 사용법
arc() 메서드는 도형/곡선을 생성합니다（원 또는 원의 일부를 생성하는 데 사용됩니다）.
고려사항:arc()를 통해 원을 생성하려면, 시작 각도를 설정하세요 0，끝 각도를 설정하세요 2*Math.PI。
고려사항:사용하세요 stroke() 또는 fill() 캔버스에 실제로 도형을 그리는 메서드.
- 중심: arc(
100,75,50,0*Math.PI,1.5*Math.PI) - 시작 각도: arc(100,75,50,
0,1.5*Math.PI) - 끝 각도: arc(100,75,50,0*Math.PI,
1.5*Math.PI)
예제
원형을 생성하세요：
JavaScript:
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.arc(100,75,50,0,2*Math.PI);
ctx.stroke();
문법
context.arc(x,y,r,sAngle,eAngle,반시계 방향);
파라미터 값
| 파라미터 | 설명 |
|---|---|
| x | 원의 중심의 x 좌표. |
| y | 원의 중심의 y 좌표. |
| r | 원의 반지름. |
| sAngle | 시작 각도, 반경으로 계산。（반경의 원형의 3시 방향 위치는 0도입니다）. |
| eAngle | 끝 각도, 반경으로 계산. |
| 반시계 방향 | 선택할 수 있습니다. 그래프를 반시계 방향으로 그리거나 시계 방향으로 그리는지 정의합니다. False = 시계 방향, true = 반시계 방향. |
브라우저 지원
표에서는 해당 속성을 최초로 완전히 지원하는 브라우저 버전을 기재했습니다.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
주의사항:Internet Explorer 8 및 이전 버전은 <canvas> 요소를 지원하지 않습니다.
