我想同时对缩放和旋转对象进行动画处理......到目前为止，我的尝试失败了。我只能链接动画（旋转，然后缩放），但不能一起旋转和缩放。
我错过了什么？
我尝试删除“additive=”sum”，但这只是覆盖并忽略了缩放动画......
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="200px" height="200px" viewBox="0 0 200 200" enable-background="new 0 0 200 200" xml:space="preserve">
<rect x="29.2" y="33.6" width="136.7" height="136.7">
<animateTransform attributeName="transform" type="scale"
from="0" to="1" dur="1s" additive="sum" accumulate="sum"/>
<animateTransform attributeName="transform" type="rotate"
from="0 100 100" to="100 100 100" dur="5s" repeatCount="indefinite" accumulate="sum" />
<animate attributeType="CSS" attributeName="opacity"
from="1" to="0" dur="4s" fill="freeze" />
</rect>
</svg>
我感谢所有的帮助！
您只需要在两个动画元素上添加additive=“sum”。经过这一更改后，它在 Firefox 上运行得很好。
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="200px" height="200px" viewBox="0 0 200 200" enable-background="new 0 0 200 200" xml:space="preserve">
<rect x="29.2" y="33.6" width="136.7" height="136.7">
<animateTransform attributeName="transform" type="scale"
from="0" to="1" dur="1s" additive="sum" accumulate="sum"/>
<animateTransform attributeName="transform" type="rotate"
from="0 100 100" to="100 100 100" dur="5s" repeatCount="indefinite" additive="sum" accumulate="sum" />
<animate attributeType="CSS" attributeName="opacity"
from="1" to="0" dur="4s" fill="freeze" />
</rect>
</svg>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
