首页 > 技术文章 > SVG.坐标转换_属性设置

h5skill 2018-01-29 16:52 原文

1、

  transform="translate(95 75) scale(1, 1.5) rotate(90 100 100)"

  transform="translate(95 75) scale(1, 1.5) rotate(90, 100 100)"

  transform="translate(95 75) scale(1, 1.5) rotate(90, 100, 100)"

 

  transform: matrix(a,b,c,d,e,f);

 

  ZC: 貌似 translate(...) & scale(...) & rotate(...) 里面的参数,用 空格 或者 逗号 来分割 都是可以的 ...(MDN 的例子中,貌似 两种方式都有...)

2、

理解SVG transform坐标变换 « 张鑫旭-鑫空间-鑫生活.html

http://www.zhangxinxu.com/wordpress/2015/10/understand-svg-transform/

 

理解CSS3 transform中的Matrix(矩阵) « 张鑫旭-鑫空间-鑫生活.html

http://www.zhangxinxu.com/wordpress/2012/06/css3-transform-matrix-%E7%9F%A9%E9%98%B5/

http://www.zhangxinxu.com/wordpress/2012/06/css3-transform-matrix-矩阵/

 

 

CSS3 transform和SVG transform rotate旋转对比示意 » 张鑫旭-鑫空间-鑫生活.html

http://www.zhangxinxu.com/study/201509/css-svg-transform-diff-rotate.html

 

CSS3 transform和SVG transform rotate旋转对比示意 » 张鑫旭-鑫空间-鑫生活.html

http://www.zhangxinxu.com/study/201509/css-svg-transform-diff-rotate.html

 

 

3、

4、

5、

 

推荐阅读