我正在使用数据图的气泡来显示每年略有变化的数据:
http://jsbin.com/goqeve/edit?html,输出
(点击底部的“1990”和“2000”按钮)
当我用 替换气泡时map.bubbles([...])
,默认动画是让新气泡从中心开始生长,这会掩盖大小的微小变化。如何让气泡在尺寸之间平滑过渡(即增长或缩小)而不是替换它们?
我正在使用数据图的气泡来显示每年略有变化的数据:
http://jsbin.com/goqeve/edit?html,输出
(点击底部的“1990”和“2000”按钮)
当我用 替换气泡时map.bubbles([...])
,默认动画是让新气泡从中心开始生长,这会掩盖大小的微小变化。如何让气泡在尺寸之间平滑过渡(即增长或缩小)而不是替换它们?
查看数据图源,我注意到它在圆圈上进行了转换,但它使用气泡对象上的 <code>JSON.stringify 作为选择的关键。如果任何属性发生更改,则将其视为新数据并将其初始半径设置为 0。我添加了一个仅使用 lat/lng 作为键的选项,因此我不需要重新编写转换:https://github。 com/markmarkoh/datamaps/pull/225
假设您的气泡数据位于名为 的列表中Nodes
。
当您从 1990 过渡到 2000(反之亦然)时,您可以更新数据的半径,Nodes
然后通过调用map.bubbles(Nodes)
. 我试过了,它顺利过渡到新的半径,而不是重新绘制它们。