NV.D3 无法读取未定义的属性 'length'

Question

我正在尝试基于读取 CSV 数据构建一个简单的条形图。现在我只是在我的脚本中包含数据。当我尝试运行它时，出现此错误：

Uncaught TypeError: Cannot read property 'length' of undefined

这是脚本：

var data;

function showChart() {
  var theCsv =
    "name,value\n" +
    "Foo,43\n" +
    "bar,76\n" +
    "foo2,88\n" +
    "bar2,59\n";
  var csvString;
  var content = [{
    key: "totals",
    values: []
  }];

  var input = d3.csv.parse(theCsv, function(d) {
    return {
      name: d.name,
      value: d.value
    };
  });

nv.addGraph(function() {
    var chart = nv.models.discreteBarChart()
      .x(function(d) {
        return d.name
      })
      .y(function(d) {
        return d.value
      })
      /*.showvalues(true)*/

    d3.select('#chart svg')
      .datum(input)
      .transition(1000)
      .call(chart)

    nv.utils.windowResize(chart.update);
    return chart;

  });

  fileDisplayArea.innerText = csvString
}

据我从调试中得知，错误发生在 .call(chart) 行，但我不知道问题出在哪里。我找到了几个讨论 D3 版本的链接，但我尝试了几个不同的链接，但仍然出现错误。

这是 JSFiddle。

Answer 1

看来您需要像这样将数据包装到另一个对象中：

var input = d3.csv.parse(theCsv, function(d) {
    return {
      name: d.name,
      value: d.value
    };
  });

// get it into the form required by `nvd3`
input = [{ key: "Some Key", values: input }]

这里是 updated fiddle，上面多加了一行。

我找不到关于 为什么 的任何文档，但这似乎是使用的模式（基于 this example on the site）。

NV.D3 无法读取未定义的属性 'length'

NV.D3 Cannot read property 'length' of undefined

d3.js

nvd3.js

NV.D3 无法读取未定义的 属性 'length'

NV.D3 Cannot read property 'length' of undefined

d3.js

nvd3.js

NV.D3 无法读取未定义的属性 'length'