首页 > 编程 > HTML > 正文

详解通过HTML5 Canvas实现图片的平移及旋转变化的方法

2024-08-26 00:18:40
字体:
来源:转载
供稿:网友
这篇文章主要介绍了通过HTML5 Canvas实现图片的平移及旋转变化的方法,其中旋转讲解的是配合平移坐标系确定圆心位置而进行的顺时针旋转,需要的朋友可以参考下
 
 

平移变换translate()
平移变换,故名思议,就是一般的图形位移。比如这里我想将位于(100,100)的矩形平移至(200,200)点。那么我只要在绘制矩形之前加上context.translate(100,100)即可。

这里的translate()只传入两个参数,其实就是新画布坐标系原点的坐标。下面结合代码来看看效果。

XML/HTML Code复制内容到剪贴板
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表