최신 웹 개발 튜토리얼
 

HTML canvas quadraticCurveTo() Method

<HTML 캔버스 참조

이차 베 지어 곡선을 그립니다 :

YourbrowserdoesnotsupporttheHTML5canvastag.

자바 스크립트 :

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.quadraticCurveTo(20,100,200,20);
ctx.stroke();
»그것을 자신을 시도

브라우저 지원

표의 수치는 완전히 방법을 지원하는 제 브라우저 버전을 지정.

방법
quadraticCurveTo() 9.0

정의 및 사용

quadraticCurveTo() 메소드는 이차 베 지어 곡선을 나타내는 지정된 컨트롤 포인트를 이용하여 전류 경로 점을 추가한다.

2 차 베 지어 곡선 두 지점이 필요합니다. 제 포인트 차 베지 연산에 사용하고 두번째 점은 곡선의 종료점이다 제어점이다. 커브의 시작점은 전류 경로의 마지막 포인트이다. 경로가 존재하지 않으면, 사용 beginPath()moveTo() 의 시작점을 정의하는 방법.

2 차 베 지어 곡선

포인트를 시작합니다
의 moveTo (20,20)
컨트롤 포인트 :
quadraticCurveTo (20,100, 200,20)
엔드 포인트 :
quadraticCurveTo (20,100, 200,20)

팁 : 체크 아웃 bezierCurveTo() 메소드를.그것은 하나가 아닌 두 개의 제어 지점을 보유하고 있습니다.


자바 스크립트 구문 : context.quadraticCurveTo(cpx,cpy,x,y);

매개 변수 값

매개 변수 기술 플레이
cpx 상기 베 지어 제어점의 X 좌표는 »플레이
cpy 상기 베 지어 제어점의 Y 좌표는 »플레이
x 다음은 끝점의 x는 좌표 »플레이
y 다음은 끝점의 y는 좌표 »플레이

<HTML 캔버스 참조