CSS3中transform中的matrix()矩阵笔录

2018-02-27 11:08:28来源:http://570109268.iteye.com作者:青春..荒唐人点击

分享

【引言】

transform:matrix(0.866,0.5,-0.5,0.866,0,0);

transform: rotate(30deg);

上面两句是等效的,这与线性代数有关

关于线性代数可以参考

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

 

matrix(a,b,c,d,e,f) 的参数拆成矩阵就是这样的

a c e b d f0 0 1

旋转z轴θ度
x轴最后会与原点偏移,X轴上的点[x,0,0]的坐标都会变成 [cosθx,sinθx,0]

          a c e [1,0,0] * b d f = [cosθ,sinθ,0]          0 0 1

y轴

          a c e [0,1,0] * b d f = [-sinθ,cosθ,0]          0 0 1

z轴 没有动

          a c e [0,0,1] * b d f = [0,0,1]          0 0 1

这样就可以反推矩阵的个个值

最新文章

123

最新摄影

闪念基因

微信扫一扫

第七城市微信公众平台