避免在am图表上重新加载动画

Question

我想知道每次用户点击任何图形变量时是否有任何方法可以避免整个图形的动画重新加载。

我有一个带有3行css动画的图表，如果我在图表中添加一个新变量，我想保留现有的行而不再动画它。

Here is the graph:

https://codepen.io/figu78/pen/QvepyM

好吧，我想保留线条动画。我不想要的是每次添加新行时重绘每一行。

我的意思是，如果绿线（50SRU）已经在图表中，当我点击黄线（150SRU）时，我不想再次重绘绿线，只有黄线应该做动画。

提前致谢！

Answer 1

通常你可以通过将startDuration设置为0来实现，但由于它已经为0，所以你只需要更改你的CSS。你必须删除：

  -webkit-animation: am-draw 10s;
  animation: am-draw 10s;

这样你就不会有图表的任何动画。