javascript - D3.js 未使用所有数据点

Question

我正在使用 D3.js 对 Facebook 群组数据进行简单的可视化。为了实现此可视化，我使用了 facebook graph api 中的数据，并将其另存为 JSON 文件。

我使用 d3.json() 加载数据函数并将其打印到控制台。控制台上的数据是文件中内容的正确表示。但是，当我将它绑定(bind)到 <g> 时d3 中的元素，然后我没有得到前 14 个数据点显示。事实上，它们在 posts 中表示为空对象。变量。

可视化的完整代码可以在以下位置查看:http://jsfiddle.net/shubhanshumishra/j8w7a6tL/我用于可视化的数据集可以在以下位置查看:https://github.com/napsternxg/FacebookGroupVisual/blob/master/Demo/demo.response.json

如果您在 JS fiddle 页面上打开 Chrome 控制台，并将框架更改为 result.jsFiddle 框架，然后运行代码，您将看到我正在打印到控制台的各种变量以及变量数据与变量的不同之处帖子。

很高兴知道为什么会发生这种奇怪的行为。

Answer 1

问题是在进行选择时，SVG 中已有 g 元素。某些数据绑定(bind)到这些元素，因此不会显示在 .enter() 选择中。更多详情请参见this tutorial .

我已通过为 g 元素分配一个类来修复您的代码 here .