d3.js选择器未返回实际对象 [英] d3.js selector not returning actual object

问题描述

我正在使用d3.js v4.我已经在Google chrome浏览器的控制台上执行了以下代码.

I am using d3.js v4. I have executed following code on google chrome browser's console.

var theData = [ 1, 2, 3 ]

var p = d3.select("body").selectAll("p")
          .data(theData)
          .enter()
          .append("p")
          .text("hello ");

console.log(p);

我期待这样的结果:

但是我得到的是如下图

有人可以帮我为什么会有这种区别吗?

Can someone please help me why this difference is there?

推荐答案

根据D3 4.x

选择不再使用原型链注入子数组；它们现在是普通对象，可以提高性能.

Selections no longer subclass Array using prototype chain injection; they are now plain objects, improving performance.

因此，在D3版本4.x中，选择是对象.

So, in D3 version 4.x, selections are objects.

此外，值得一提的是，您使用的是压缩版本( https://d3js. org/d3.v4.min.js )，它返回:

Also, it's worth mentioning that you're using the compressed version (https://d3js.org/d3.v4.min.js), which returns:

zi {_groups: Array[1], _parents: Array[1]}

在普通版本中( https://d3js.org/d3.v4.js )，console.log返回应为:

In the normal version (https://d3js.org/d3.v4.js), the console.log return should be:

Selection {_groups: Array[1], _parents: Array[1]}

如果您想获得与D3 v3类似的东西，请使用nodes():

If you want to get something similar to what you had in D3 v3, use nodes():

var theData = [ 1, 2, 3 ]

var p = d3.select("body").selectAll("p")
          .data(theData)
          .enter()
          .append("p")
          .text("hello ");

console.log(p.nodes());

<script src="https://d3js.org/d3.v4.js"></script>

这篇关于d3.js选择器未返回实际对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！