例
在绘制位置的矩形(10,10)设置新的(0,0)位置(70,70) 再次绘制相同的矩形（请注意，矩形现在位置开始(80,80)
JavaScript的：
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 | 是 | 是 | 是 |
定义和用法
该translate()方法重新映射(0,0)在画布上的位置。
注意：当调用一个方法如fillRect()后translate()该值被添加到X和Y坐标值。
| JavaScript语法： | context.translate( x,y ); |
|---|
参数值
注意：您可以指定一个或两个参数。
| 参数 | 描述 | 播放 |
|---|---|---|
| x | 值要添加到水平方向（x）的坐标 | 播放 ” |
| y | 值要添加到垂直（y）坐标 | 播放 ” |