Javascript SVG仅使用“设置动画”；至；属性

我想将SVG路径设置为两种不同的状态。为此，我创建了一个三角形路径，带有两个示例动画，我通过Javascript触发它们

这些动画仅具有“to”属性，因为其目的是为从任何状态到任何其他所需状态的路径设置动画（最终动画将具有10+个状态）

您可以在此处看到一个工作示例：

问题是，至少在Chrome中，如果单击Animation1，然后单击Animation2，然后再单击返回Animation1，则效果良好。然而，紧接着，动画停止工作，或者只有一个工作。我相信动画是被触发的，但它没有被绘制出来。这个问题在Firefox中不会发生，我已经读到Webkit和Blink有很多SVG错误

---

你知道一个解决办法，使它正确地绘制在铬以及

svg中的动画有点复杂，特别是当涉及到fill和to之类的事情时，要使事情保持一致非常困难。我认为它可以用于动画序列，但对于更具交互性的内容（如果有人点击中间动画等）就没那么好了。我个人会使用其中一个动画库编写一个解决方案，或者手动调整元素属性并制作自己的动画（如果这使sensePlease文件成为bug的话）。