HTML 캔버스 arcTo() 메서드

예시

캔버스의 두 접선 사이에 호를 만듭니다.

자바스크립트:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20, 20);           // Create a starting point
ctx.lineTo(100, 20);          // Create a horizontal line
ctx.arcTo(150, 20, 150, 70, 50); // Create an arc
ctx.lineTo(150, 120);         // Continue with vertical line
ctx.stroke();                // Draw it

브라우저 지원

표의 숫자는 이 방법을 완전히 지원하는 첫 번째 브라우저 버전을 지정합니다.

Method
arcTo()	Yes	9.0	Yes	Yes	No

정의 및 사용

arcTo() 메서드는 캔버스의 두 접선 사이에 호/곡선을 만듭니다.

캔버스 arcto() 다이어그램

팁: 실제로 캔버스에 호를 그리려면 stroke() 메서드를 사용하십시오 .

자바스크립트 구문:	컨텍스트 .arcTo( x1,y1,x2,y2,r );

매개변수 값

Parameter	Description	Play it
x1	The x-coordinate of the first tangent
y1	The y-coordinate of the first tangent
x2	The x-coordinate of the second tangent
y2	The y-coordinate of the second tangent
r	The radius of the arc

❮ HTML 캔버스 참조

HTML 참조

HTML Tags

HTML 캔버스 arcTo() 메서드

예시

브라우저 지원

정의 및 사용

매개변수 값