Canvas arcTo() 메서드

정의와 사용법

arcTo() 화면에 두 절대선 사이에 곡선/곡선을 만드는 메서드.

힌트:이렇게 사용하세요 stroke() 화면에 정확한 곡선을 그리는 메서드.

예제

두 절대선 사이에 곡선을 그립니다:

귀하의 브라우저는 HTML5 canvas 태그를 지원하지 않습니다.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.beginPath();
ctx.moveTo(20,20);           // 시작점을 만듭니다
ctx.lineTo(100,20);          // 수평선을 만듭니다
ctx.arcTo(150,20,150,70,50); // 곡선을 만듭니다
ctx.lineTo(150,120);         // 직선을 만듭니다
ctx.stroke();                // 그리기

직접 시도해 보세요

문법

context.fillRect(x1,y1,x2,y2,r);

파라미터 값

파라미터 설명
x1 곡선의 시작점의 x 좌표
y1 곡선의 시작점의 y 좌표
x2 곡선의 끝점의 x 좌표
y2 호각의 끝의 y 좌표
r 호각의 반지름

브라우저 지원

표의 숫자는 해당 속성을 최초로 완전히 지원하는 브라우저 버전을 나타냅니다.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

주석:Internet Explorer 8 및 이전 버전은 <canvas> 요소를 지원하지 않습니다.