예
이차 베 지어 곡선을 그립니다 :
자바 스크립트 :
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() | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
정의 및 사용
quadraticCurveTo() 메소드는 차 베지에 곡선을 나타내고 지정된 컨트롤 포인트를 이용하여 전류 경로 점을 추가한다.
, 2 차 베지에 곡선의 두 지점을 필요로한다. 첫번째 점은 차 베지 연산에 사용하고 두번째 점은 곡선의 종료점이다 제어점이다. 곡선의 시작점은 현재 경로의 마지막 지점입니다. 경로가 존재하지 않을 경우, 사용 beginPath() 과 moveTo() 시작점을 정의하는 방법을.
시작점:
moveTo( 20,20 ) 컨트롤 포인트 :
quadraticCurveTo( 20,100 ,200,20) 종료 지점 :
quadraticCurveTo(20,100, 200,20 ) Tip: 아웃 확인 bezierCurveTo() 메소드를. 그것은 하나가 아닌 두 개의 컨트롤 포인트가 있습니다.
| 자바 스크립트 구문 : | context . quadraticCurveTo( cpx,cpy,x,y ) ; |
|---|
매개 변수 값
| 매개 변수 | 기술 | 플레이 |
|---|---|---|
| cpx | 상기 베 지어 제어점의 X 좌표 | »플레이 |
| cpy | 상기 베 지어 제어점의 Y 좌표 | »플레이 |
| x | 다음은 끝점의 x 좌표 | »플레이 |
| y | 다음은 끝점의 y 좌표 | »플레이 |