javascript - 是否可以使用此数据在nvd3.js中生成图形？

我有一个输出以下内容的小函数：

[
    {
        "label": "A",
        "value": 101.23
    },
    {
        "label": "B",
        "value": 109.87
    },
    {
        "label": "C",
        "value": 107.34
    },
    {
        "label": "D",
        "value": 115.17
    },
    {
        "label": "E",
        "value": 119.61
    }
]

我正在尝试并且惨败的是使用该数据生成图形。我想用nvd3或d3生成一个简单的条形图。

我所拥有的是：

var output = [];

Object.keys(input.Data).forEach(function(key){
    if(key.indexOf('mean') > -1){
    output.push({label: key,value: input.Data[key]});
    }
});

nv.addGraph(function() {
    var chart = nv.models.discreteBarChart()
        .x(function (d) {return d.label})
        .y(function (d) {return d.value})


    d3.select('#chart svg')
        .datum(output)
        .call(chart);

    nv.utils.windowResize(chart.update);

    return chart;
});

我收到TypeError：无法读取未定义的属性“ length”。

我对nvd3或d3不够熟悉，无法对其进行跟踪，但它可能与版本不匹配有关。我正在使用d3 v3.5.1和nvd3 v1.8.3。虽然只是一个猜测。

任何帮助是极大的赞赏。

最佳答案

数据必须采用这种格式。

output = [{
  key: "",
  values: [{
    "label": "A",
    "value": 101.23
  }, {
    "label": "B",
    "value": 109.87
  }, {
    "label": "C",
    "value": 107.34
  }, {
    "label": "D",
    "value": 115.17
  }, {
    "label": "E",
    "value": 119.61
  }]
}]

工作代码here