최신 웹 개발 튜토리얼
 

HTML canvas translate() Method

<HTML 캔버스 참조

위치에 사각형 그리기 (10,10) , 새로운 설정 (0,0) 에 위치 (70,70) . 다시 같은 사각형을 그립니다 (사각형 지금 위치에서 시작하는 것을 알 (80,80) :

YourbrowserdoesnotsupporttheHTML5canvastag.

자바 스크립트 :

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() 9.0

정의 및 사용

translate() 메소드는 다시 매핑 (0,0) 캔버스에 위치.

참고 : 같은 메소드를 호출 할 때 fillRect()translate() , 값은 X 축에 첨가하고 값을 y 좌표.

번역 방법의 그림

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

매개 변수 값

참고 : 하나 또는 두 개의 매개 변수를 지정할 수 있습니다.

매개 변수 기술 플레이
x 값은 수평 (x)의 좌표에 추가 »플레이
y 값은 수직 (Y) 좌표에 추가 »플레이

<HTML 캔버스 참조