canvas变形方法transform的可视化演示

canvas 的变形方法transform是三个基本变形方法的结合,他们是
translate——移动;scale——缩放 ;rotate ——旋转,在transform方法中分解为x,y两个方向的斜切。
他的参数是变形矩阵的六个数值:m11, m12, m21, m22, dx, dy
变形矩阵:
m11 m21  dx  
m12 m22 dy  
0  0  1  

对于transform方法的使用,其实很难把握,所以写了下面这个演示





cssass.com




Transform方法可视化操作演示


 


 


 


 


 


 




注意:ie9以下用户请绕行




相关文章 bezierCurveTo方法的可视化演示:http://bbs.blueidea.com/thread-2999324-1-1.html

好消息! 
目前已经有一款Illustrator的插件支持导出canvas code:http://visitmix.com/labs/ai2canvas/

你可能感兴趣的:(canvas变形方法transform的可视化演示)