translate（）方法

在canvas中，可以使用translate()方法来平移图形。所谓的平移，是指图形沿着x轴或y轴进行直线运动。平移不会改变图形的形状和大小。

语法：

 cxt.translate(x,y);

说明：

x表示图形在x方向上移动的距离，默认单位是px。当x为正时，图形向x轴正方向移动；当x为负时，图形向x轴反方向移动。

y表示图形在y方向上移动的距离，默认单位是px。当y为正时，图形向y轴正方向移动；当y为负时，图形向y轴反方向移动。

注意：canvas使用的坐标系为W3C坐标系（y轴正方向向下），而不是数学坐标系（y轴正方向向上）。

看下面一段代码：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8" /><title>translate()方法</title><script>function $(id){return document.getElementById(id);}window.οnlοad=function(){var cv=$('canvas');var cxt=cv.getContext('2d');//绘制矩形cxt.fillStyle='skyblue';cxt.fillRect(30,30,50,50);//移动矩形cxt.translate(50,50);cxt.fillRect(30,30,50,50); //重绘，这里仍然是fillRect(30,30,50,50)};</script>
</head>
<body><canvas id="canvas" width='200' height='150' style='border:1px solid grey;'></canvas>
</body>
</html>

在浏览器中的预览效果图如下：

translate（）方法相关推荐

在LINQ to SQL中使用Translate方法以及修改查询用SQL
目前LINQ to SQL的资料不多--老赵的意思是,目前能找到的资料都难以摆脱"官方用法"的"阴影".LINQ to SQL最权威的资料自然是MSDN,但是M ...
《Python CookBook2》第一章文本 - 检查字符串中是否包含某字符集合中的字符简化字符串的translate方法的使用...
检查字符串中是否包含某字符集合中的字符任务: 检查字符串中是否出现了某个字符集合中的字符解决方案: 方案一: import itertoolsdef containAny(seq,aset):f ...
CSS3中使用translate() 方法实现元素位置的移动
translate() 方法通过 translate() 方法,元素从其当前位置移动,根据给定的 left(x 坐标) 和 top(y 坐标) 位置参数: 实例 div { transform: t ...
[css] 请描述下你对translate()方法的理解
[css] 请描述下你对translate()方法的理解 Single length/percentage value一个长度值或百分比表示X轴和Y轴使用一样的值进行二维上的平移.等同于transla ...
python中的translate_Python translate()方法
描述 Python translate() 方法根据 maketrans() 方法给出的字符映射转换表转换字符串中的字符. 语法 translate() 方法语法: Python3中: S.trans ...
transform:translate()方法坐标详解
定义:translate()方法,根据左(X轴)和顶部(Y轴)位置给定的参数,从当前元素位置移动. 但是如何移动呢?于是做了以下实验: 实验1.设置transform:translate(0px,0p ...
关于maketrans方法和translate方法一起使用的说明（从字符串中删除某些字符，请区别于replace）
str.marktrans方法:生成一个dict表.对应翻译表(asc码格式), 如:t = str.maketrans('abcdefghi', '123456789',"abfgjk&q ...
Python中maketrans和translate方法
Python字符串maketrans()方法返回一个转换表,它将含有制表符的字符串intabstring中的每个字符映射到outtab字符串中相同位置的字符.然后将此表传递给translate()函数 ...
Android 对Canvas的translate方法总结
方法translate(x,y): 平移,将画布的坐标原点向左右方向移动x,向上下方向移动y.canvas的默认位置是在(0,0). 例子:画布原点假如落在(1,1),那么translate(10 ...
python发音翻译-Python translate()方法
先按照转换表的替换出新的 string,然后再执行 del 参数的替换,有个先后顺序: # -*- coding:utf-8 -*- from string import maketrans inta ...

translate（）方法

translate（）方法相关推荐

最新文章

热门文章