平滑地设置新元素的动画是从右边但不是从左边开始

时间:2013-10-03 03:24:46

标签: animation d3.js

我是在没有太多努力的情况下创建的:http://jsfiddle.net/langdonx/J2ykT/1/

如果你检查动画框,你会看到元素如何非常顺利地进出右边(如果随机数生成器给你0,那么请原谅。)

现在我正试图让元素从左边开始逐步进入,但似乎selection.insert没有像我预期的那样插入元素。你可以在这里看到我在说什么:

http://jsfiddle.net/wqPfR/

10001001都会附加到div,但当我将999插入我的数组时,我希望.enter()能够为我提供999 1001,但我获得了rect,因为看起来D3只会附加元素并重新索引现有元素。

我的问题是,由于我将展示我的{{1}}元素,因此我无法在创建新元素时重绘每个单元格。

我只是不能将D3用于此技术,还是有些东西我不知道?

1 个答案:

答案 0 :(得分:4)

默认情况下,.data()按索引匹配现有元素。如果您希望它们与值或某些内部属性匹配,则必须为此提供一个函数。在您的示例中,这将起作用:

.data(data, function(d) { return d; });

来自documentation for .data()

  

要控制数据如何连接到元素,可以指定键功能。这将替换默认的by-index行为;为新数据数组中的每个元素调用一次键函数,并对选择中的每个现有元素再次调用。