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

【问题标题】：How do I pull nested data into a bar chart using D3?如何使用 D3 将嵌套数据拉入条形图中？
【发布时间】：2015-04-09 16:04:23
【问题描述】：

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

有我的 gist 文件，你可以看到数据有结构：

{
  "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 文件的子附件中提取图表？

谢谢。

【问题讨论】：

标签： javascript d3.js bar-chart

【解决方案1】：

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

var data = data.children;

另外，我认为您不需要将“类型”作为 d3.json 方法的参数，这可能会导致对 JSON 数据的请求出错。我可能会删除它，以便该行显示为：

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

【讨论】：