D3是否为我们设置的每个回调循环遍历整个数组？

bachinblack

看起来d3每次设置回调时都会遍历整个数组。

起初，我认为调用函数喜欢attr()或each()将它们添加到管道中，并且整个管道稍后又全部执行。

我试图设置代码以动态处理d3使用的SINGLE循环中的数据，而我刚刚发现each()哪个为每个点调用了一个函数。

目的是将我的观点从javascript对象转换为单个值，并避免在每个回调或单独的循环中这样做。

我尝试了一下，发现了这种行为。

这是一个基本示例：

d3.select(ref)
.selectAll("rect")
.data(data)
.enter()
.append("rect")
.each(function(d) { console.log(d); })
.attr("y", function(d) { console.log("attr y"); return 10; })
.attr("fill", function(d) { console.log("fill"); return "red";})

这是一个jsfiddle：http : //jsfiddle.net/7q3p2kah/1/

我期待看到这样：

red
attr y
fill
green
attr y
fill
...

但是我得到了：

red
green
blue
yellow
black
(4)attr y
(4)fill

所有此实验的目的是减少显示我的图形所需的时间。

我是否一定要使用一个单独的循环来处理我的数据，或者我没有得到什么？

它看起来很像“yes()或”no()问题，但是很高兴看到任何解释或替代解决方案。

易卜拉欣单宁

您可以将attr函数包装在内each：

...
.each(function(d) { 
    d3.select(this)
    .call(function(selection){console.log(d);})
    .attr("y", function(d) { console.log("attr y"); return 10; })
    .attr("fill", function(d) { console.log("fill"); return "red";}
})
...

更普遍的像这里：https : //jsfiddle.net/ibowankenobi/wns19k4d/

如果您是我，我会将所选节点存储在NodeList或中，LiveHTMLCollection而不是使用d3.select(this)像之类的list[i]东西来访问它们d3.select，从长远来看可能会有点慢。