HTML Canvas 곡선
实例
const canvas = document.getElementById("myCanvas"); const ctx = canvas.getContext("2d"); ctx.beginPath(); ctx.arc(100, 50, 50, 0, Math.PI); ctx.stroke();
arc() 메서드
곡선은 원의 일부이며, 중심점 좌표와 반지름으로 정의됩니다:

Canvas 곡선 그리기
화면의 경로를 사용하여 원을 그리십시오:
메서드 | 설명 | 그리기 |
---|---|---|
beginPath() | 경로 시작 | No |
arc() | 곡선 정의 | No |
stroke() | 그래픽. | Yes |
화면에 원을 그리기 위해 다음 메서드를 사용하십시오:
- beginPath() - 경로 시작
- arc(x,y,r,start,end) - 원 정의
- stroke() - 그리기
arc(x,y,r,start,end) - 곡선(끝)
원을 만들기 위해, 시작 각도를 0으로 설정하고, 종료 각도를 2 * Math.PI로 설정하십시오.
x와 y 파라미터는 원심의 좌표를 정의합니다.
r 파라미터는 원의 반지름을 정의합니다.