javascript - 如何使用 Google Charts 动画为数值设置动画？特别是量规

Question

在这个 JS Fiddle 示例中，仪表会定期更新为新值。

https://jsfiddle.net/n5fvb8ft/ （感谢 nbering 的更正）

此示例使用 setInterval 分配随机新值，例如

setInterval(function() {
          data.setValue(0, 1, 40 + Math.round(60 * Math.random()));
          chart.draw(data, options);
        }, 13000);

如您所见，新数字出现并且针朝它移动。我真的很想用针显示当前数字更新，而不仅仅是显示最终值。这可以使用谷歌图表吗？另外我想放慢动画速度，但这可能是另一个问题。

我想可能会在该值上设置一个补间并以与针动画相同的持续时间对其进行动画处理，然后反复更新仪表，但这会非常笨拙，并且针可能会在很多小动作中进行动画处理。当然，尽管必须有更好的方法。

任何帮助将不胜感激。

score 1 · Accepted Answer

据我了解这个问题，您希望径向仪表内出现的数字显示指针指向的值，而不是指针动画指向的值。

如果是这种情况，那么不，这不是 Google Charts API 的可用功能。您可能可以按照您的建议破解它，但这可能不会像您希望的那样表现得那么好，并且会涉及很多 setTimeouts。因此，如果您有任何其他长时间运行的代码阻塞了事件循环，您会得到抖动的动画。

1 回答 1