SVG动画如何累积应用值

Question

我正在做一些需要在一些SVG中从javascript旋转元素的工作。为此，我一直在测试如何设置SVG项目，定义动画，然后在SVG本身之外（来自js）基于任意事件运行动画。在动画运行之前，我设置旋转的度数以及我希望旋转的速度。

一切正常。

我的问题是，当动画完成后，svg将恢复为原始状态。这意味着如果我将SVG旋转到90度，当动画完成时，SVG会立即恢复到0度。

我在w3.org查看了svg doco，特别是添加和累积选项，但它们似乎对我不起作用。

我确信这是微不足道的，但我看不出问题的原因是什么。

JSfiddle example of the problem

感谢Robert，我有解决方案。我已经在下面添加了解决方案。

JSfiddle example of the solution

Answer 1

将fill =“freeze”添加到animateTransform元素。