Baz*_*777 25 javascript svg snap.svg
我一直在尝试学习snap.svg,我对转换属性有一些疑问.我的问题很愚蠢,但现在确实如此
在以下示例代码中,数字是什么意思?
{"transform" : "t-10 0 s0 32 32"}
{"transform" : "r180 32 32"}
Run Code Online (Sandbox Code Playgroud)
我猜测s代表规模,animAfter和after之间有什么区别?我是SVG的新手.
Ian*_*Ian 51
转换格式是一个字符串,它是一系列转换,因此您可以互相拥有多个转换格式.
编辑:Snap这些天没有对大小写区分,所以这部分没有区别(可能值得注意它,如果你看到一些Raphael.js代码并且想要理解),其余的仍然应该是相关的...
T/t =平移(t是相对的,T是绝对的)R/r =旋转(r是相对的,R是绝对的)S/s =标度(s是相对的,S是绝对的)
如果Snap.svg没有足够的信息,那么值得查看Raphael变换文档,因为存在很多重叠.
对于变换,有些将引用一个"原点中心"来旋转/缩放等,因为有时您可能希望原点中心是对象本身,有时为0,0,有时在特定点附近.
t-10 0 s0 32 32 会转换x,y -10,0,然后缩放x,y,cx,cy,因此在cx 32周围的x,32上缩放0.
r180 32 32将绕点32,32旋转180度.您通常可以使用逗号或空格来分隔值.
after表示动画结束后设置的"属性"值.animafter表示动画结束后要设置的"动画"值.
| 归档时间: |
|
| 查看次数: |
19673 次 |
| 最近记录: |