datamaps.js -如何在气泡大小之间顺利过渡？

Question

我使用datamaps的泡泡来显示年复一年略有变化的数据：

http://jsbin.com/goqeve/edit?html,output

(在底部的“1990”和“2000”按钮之间单击)

当我用map.bubbles([...])替换气泡时，默认的动画是让新的气泡从中心长出来，这掩盖了大小上的小变化。如何才能使气泡在大小之间平稳地过渡(即增长或收缩)而不是替换它们？

Answer 1

在查看datamaps源代码时，我注意到它在圆圈上进行了转换，但它使用了气泡对象上的JSON.stringify​​作为选择的关键。如果任何属性发生更改，则将其视为新数据，并将其初始半径设置为0。我添加了一个选项，只使用lat/lng作为键，因此我不需要重写转换：https://github.com/markmarkoh/datamaps/pull/225。

Answer 2

假设您的气泡数据位于一个名为Nodes的列表中。

当您从1990年转换到2000年(反之亦然)时，您可以更新Nodes中数据的半径，然后通过调用map.bubbles(Nodes)重新绘制数据。我试了一试，它顺利地过渡到新的半径，而不是重画他们。