0

d3.js 中是否可以根据当前数据追加或插入新元素?

我把一个例子放在一起来展示我想要实现的目标

http://jsfiddle.net/DorjeDuck/uDBau/

基本上,新的红色圆圈总是绘制在所有蓝色圆圈的顶部,而新的蓝色圆圈总是放在所有红色圆圈的下方。

到目前为止,这是通过过滤数据集(javascript 数组过滤器,而不是 d3 过滤器)来实现的。过滤功能:

var selectNewOnesByColor = function (selection, color) {
    return selection.data(data.filter(function (d) {
        return d.color === color;
    }), function (d) {
        return d.id;
    })
        .enter();
}

随后,为一个子集附加圆圈并为另一个子集插入圆圈。虽然这可行,但我想知道是否有更直接的方法可以实现这一目标。

谢谢

马丁

4

1 回答 1

1

我认为过滤数据以实现两个不同的输入选择的方法是正确的方法。这是一个关于这个主题的主题(链接到另外两个有趣的主题):https ://groups.google.com/forum/#!msg/d3-js/PKsknGxmZ8g/ULxwneU00J4J 。

在其中一个子线程中,有一个示例显示了使用selection.select返回新附加或插入节点的函数。这实际上是内部实现的方式selection.appendselection.insert实现方式,因此如果您真的想将节点创建合并到单个数据绑定通道中,您可以有效地使用它。该函数获得当前数据,并将使用您返回的任何节点作为选择元素中的节点。

但我认为你对预过滤所做的事情更直接。

于 2013-10-18T19:09:46.730 回答