Question

我使用它来解析csv文件并创建d3 docs中指定的数组数据：

d3.csv("afile.csv", function(data) {
    data.forEach(function(d) {
    d.date = formatDate.parse(d.date);
    d.price = +d.price;
});

但是，如果在此方法之后我尝试调用data[0]，则说它未定义。这是因为data是一个引用，一旦d3.csv()超出范围就被销毁了吗？如果是这种情况，我怎么能克服这一点。我需要引用d3.csv()

之外的数据

Answer 1

d3.csv是一种异步方法。这意味着回调函数内部的代码在加载数据时运行，但在请求发出后，当数据尚不可用时，回调函数之后的代码将立即运行。换句话说：

first(); d3.csv("path/to/file.csv", function(rows) { third(); }); second();

如果要使用d3.csv加载的数据，则需要将该代码放在回调函数中（上面有third）：

d3.csv("path/to/file.csv", function(rows) { doSomethingWithRows(rows); }); function doSomethingWithRows(rows) { // do something with rows }

或者，您可以将其保存为窗口中的全局变量，然后可以引用该窗口：

var rows; d3.csv("path/to/file.csv", function(loadedRows) { rows = loadedRows; doSomethingWithRows(); }); function doSomethingWithRows() { // do something with rows }

如果需要，您还可以明确地将加载的数据分配给窗口对象，而不是声明变量然后管理两个不同的名称：

d3.csv("path/to/file.csv", function(rows) { window.rows = rows; doSomethingWithRows(); }); function doSomethingWithRows() { // do something with rows }

Answer 2

我认为你的问题是计时，因为它是异步调用。因此，按照您的方式加载数据，但在d3代码中调用该函数（Mike有'doSomethingWithRows（）'）。不要再使用d3代码进行处理（Mike有'second（）'），将代码移到'doSomethingWithRows（）'函数中。它将提供数据并远离您...

Answer 3

我认为问题已经解决，但我遇到了类似的问题，上面的讨论并没有帮助。所以我发布了解决这个问题的方法：这里，data[0]未定义的原因可能是因为浏览器没有读取数据本身。这种读取失败可能是由于直接加载数据（csv）文件，即使用以下命令d3.csv("myCSVfile.csv",....)。这种方法可能无法正常工作，因为Web应用程序通常需要从Web服务器加载文件（不确定为什么会这样）。因此需要建立本地Web服务器。使用此论坛了解如何：How do I setup a local HTTP server using Python。如果使用Python 3创建本地Web服务器，则更新的代码将为：d3.csv("http://localhost:8000/myCSVfile.csv",.....)。

Answer 4

在then(function(data))回调中，您将获得hold数组。

d3.csv("afile.csv", function(row) {
  return {name1: row.name1, name2: row.name2, ...}
}).then(function(d){
   console.log(d) // => [{{name1: row.name1, name2: row.name2, ...}}, {name1: row.name1, name2: row.name2, ...} ....]
});

Answer 5

你可以在回调函数之外声明一个变量，然后用csv中的值赋值：

var csv_data;
d3.csv("afile.csv", function(data) {
  data.forEach(function(d) {
    d.date = formatDate.parse(d.date);
    d.price = +d.price;
  csv_data = data;
});

然后在回调之外使用csv_data

csv到d3.js中的数组

5 个答案: