예
위치에 사각형 그리기 (10,10) , 새로운 설정 (0,0) 에 위치 (70,70) . 다시 같은 사각형을 그립니다 (notice that the rectangle now starts in position (80,80) :
자바 스크립트 :
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillRect(10,10,100,50);
ctx.translate(70,70);
ctx.fillRect(10,10,100,50);
»그것을 자신을 시도 브라우저 지원
테이블의 숫자는 완전히 방법을 지원하는 최초의 브라우저 버전을 지정합니다.
| 방법 | |||||
|---|---|---|---|---|---|
| translate() | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
정의 및 사용
translate() 메소드는 다시 매핑 (0,0) 캔버스에 위치.
Note: 하면 다음과 같은 메소드를 호출 할 때 fillRect() 후 translate() 값은 X 축에 첨가하고, 값을 y 좌표.
() 메소드를 "번역 /> | 자바 스크립트 구문 : | context . translate( x,y ) ; |
|---|
매개 변수 값
Note: 당신은 하나 또는 두 개의 매개 변수를 지정할 수 있습니다.
| 매개 변수 | 기술 | 플레이 |
|---|---|---|
| x | 값은 수평에 추가 (x) 좌표 | »플레이 |
| y | 값은 수직에 추가 (y) 좌표 | »플레이 |
<캔버스 개체