javascript - 如何使用 D3 将嵌套数据拉入条形图中？

Question

http://bl.ocks.org/sconnors37/712bf691cefc1a1cb987/e9ae1b459c18fc15b5eb2c9b2fdb46c5f4a6e3ff

这是我的要点文件，你可以看到数据的结构:

{
  "children": [
    {
      "name": "Al Montoya",
      "saves": 155
},
{
  "name": "Alex Stalock",
  "saves": 147
},
{
  "name": "Anders Lindback",
  "saves": 124
},
{
  "name": "Anton Khudobin",
  "saves": 214}]}

等等

我试图将其拉入我的 d3 条形图中，以便“保存”沿 Y 轴，“名称”沿 X 轴。当我编辑数据以删除“子”外壳时，一切正常。我需要编辑什么才能从这个 .json 文件的子附件中提取图表？

谢谢。

Answer 1

我认为这里发生的情况是，默认情况下，d3.json 回调函数中的 data 参数查看 JSON 文件的顶层。在本例中，这只是对象的“子”数组。由于您需要使用其中的对象，因此我认为如果您创建一个专门深入到该数组的新变量，那应该会有所帮助。尝试简单地将其添加到 x.domain 函数之前:

var data = data.children;

此外，我认为您不需要将“type”作为 d3.json 方法的参数，这可能会导致 JSON 数据的请求失败。我可能会删除它，以便该行显示:

d3.json("data.json", function(error, data) {