困惑selection.filter

Question

我很难理解selection.filter。我想这一点，在一个空白文档：

d3.selectAll('rect') 
    .data([1, 2, 3]) 
    .filter(function(d) { return d>1; }) 

// [ Array[0] ] 

我预想的选择有两个元素，但它有0也许是因为我有一个空的更新选择工作......

d3.selectAll('rect') 
    .data([1, 2, 3]) 
    .enter() 
    .filter(function(d) { return d>1; }) 

// [] 

现在看来我甚至没有选择。

如果DOM元素存在

d3.selectAll('rect').data([1, 2, 3]) 
    .enter().append('rect') 

，然后我选择和过滤

d3.selectAll('rect').filter(function(d) { return d>1; }) 

// [ Array[2] ] 

它似乎工作。那么这里发生了什么？筛选器似乎在this example中对不与任何DOM元素对应的选择工作，所以我期望它在我上面的第一个示例中工作。

Answer 1

.filter()函数仅适用于已将数据绑定到它们的选择，即在您调用.data()之后才能使用该函数。您连这个例子实际上并不工作，似乎做的方式 - 让我再次缩进为清楚：

var node = svg.selectAll(".node") 
    .data(bubble.nodes(classes(root)) 
    .filter(function(d) { return !d.children; }) 
) 
    .enter().append("g") 

的.filter()功能实际上并不适用于选择在这里，但到阵列bubble.nodes()返回。然后传递给.data()。这正是您在类似于您的情况下所要做的 - 如果您可以过滤决定它的数据，则无需过滤选择。