Question

这是来自d3 csv API文档：

d3.csv("path/to/file.csv")
    .row(function(d) { return {key: d.key, value: +d.value}; })
    .get(function(error, rows) { console.log(rows); });

如何将rows传递给var data，而不只是console.log。我只想要来自csv的数据，但我不熟悉JavaScript。

Answer 1

此处的答案仅适用于d3 v4及以下版本。从d3 v5开始，此方法已更改。有关最新解决方案，请参阅this answer。

请记住，d3.csv()无法返回任何数据，因为数据必须先加载。这就是我们使用回调函数的原因，这些函数在加载数据后会被调用（您可以通过研究“异步javascript”来了解更多信息）。

您仍然可以将已加载的数据分配给变量，但您必须记住隐含异步函数。

// This will be assigned to rows, once the data is ready.
var myData = null;

d3.csv("path/to/file.csv")
    .row(function(d) { return {key: d.key, value: +d.value}; })
    .get(function(error, rows) {
      console.log(rows);
      myData = rows;// Now you can assign it
      myDataIsReady()// Now you can draw it
    });

// IMPORTANT NOTE! Here myData is still null
console.log(myData);// will trace null

function myDataIsReady() {
  console.log(myData);// will trace the data that was loaded
  // Here you can draw your visualization
}

重点是，在加载和解析CSV之前，您无法绘制任何内容。所以无论如何，你的绘图代码必须存在于从d3.csv回调调用的函数中。

可以构建代码，以便您永远不需要将rows分配给变量（您只需将rows传递给绘制数据的函数。）

D3 csv返回行

1 个答案: