是否有SVG元素的大小调整动画

时间:2013-08-06 20:21:32

标签: svg svg-animate

我所拥有的是JS代码动态生成的一些svg元素,例如由几何图形组成的线条和圆圈,我想要实现的是尝试使用svg动画功能连续重新缩放图形。我的意思是我当然可以重新计算线的每个点的坐标和圆的中心点并从那里开始,但这将是一个太繁琐的解决方案,我怎么能做得更好?

非常感谢!

1 个答案:

答案 0 :(得分:1)

将它们放在<g>元素中,然后为<g>提供变换属性,例如transform =“scale(1)”,并使用子<animateTransform>元素对其进行动画处理。这样的事也许......

<animateTransform attributeName="transform"
 attributeType="XML" type="scale" from="1" to="3"
 additive="sum" begin="1s" dur="5s" fill="freeze"/>