从 D3 中的多个 csv 文件导入数据答案

【问题标题】：Importing data from multiple csv files in D3从 D3 中的多个 csv 文件导入数据
【发布时间】：2014-03-17 12:49:26
【问题描述】：

我是 D3 的新手，刚开始从事一个项目。我的问题是这个。我想从 D3 中的 2 个 csv 文件中导入数据，以将它们用于图形比较。我面临的问题是：

1.如何从多个csv文件导入数据。
2.我可以为每个csv使用一个数组还是D3只使用一个全局数据数组？
3.有没有办法从 csv 文件中选择某一列来导入？

这是一个例子，我想从单独的数组中的每个文件中导入“oldVer”，然后使用 2要使用的数组。这在 D3 中是否可行？如何实现？

csv 1
时间,oldVer,newVer,oldT,newT
1,180930,190394,24,59
2,198039,159094,26,45
3,152581,194032,22,61

csv 2
时间,oldVer,newVer,oldT,newT
1,184950,180435,27,26
2,120590,129409,13,13
3,165222,182133,60,54

再次为这个愚蠢的问题感到抱歉，但我发现关于此事的反馈很少。任何帮助将不胜感激。

【问题讨论】：

标签： javascript arrays csv import d3.js

【解决方案1】：

在 d3 版本 5 中，您可以使用 Promise.all 加载多个 csv 文件。示例：

Promise.all([
    d3.csv("file1.csv"),
    d3.csv("file2.csv"),
]).then(function(files) {
    // files[0] will contain file1.csv
    // files[1] will contain file2.csv
}).catch(function(err) {
    // handle error here
})

More info about loading csv in d3 v5

More info about Promise.all()

【讨论】：

感谢@Abang F，我见过的最简单最清晰的演示：)
我能以某种方式将它用于动态数量的文件吗？
@blckbird Promise.all(fileList.map(d3.csv)).then(...)

【解决方案2】：

您只需多次拨打d3.csv：

d3.csv("csv1.csv", function(error1, data1) {
  d3.csv("csv2.csv", function(error2, data2) {
    // do something with the data
  });
});

至于你的第三个问题，不，D3 会解析所有内容。不过，没有什么会强迫您使用所有数据，所以如果您只对一列感兴趣，只需使用其中的数据即可。

【讨论】：

嗨 Lars，由于目标是比较数据，因此两者同时可用，因此需要控制这些嵌套异步调用的执行流程，不是吗？如果我们在内部函数内部做一些事情，并不能保证 data1 会准备好。我对吗？我正在阅读this。它正在谈论 node.js，但也许它会适用。
就在现场，我现在就试试。我之前读过异步调用，但不能说太多，我只需要尝试一下。谢谢你们的快速反应。
如果我在这里，在我引用的链接中，我相信你想要 7.2.2 控制流模式 #2，其中“......我们只想进行一小部分操作，启动它们全部并行，然后在它们全部完成后执行一些操作。”
@FernOfTheAndes 不——这正是嵌套需要处理的。我仅在第一个请求完成时才发送对第二个 CSV 的请求，因此在第二个处理函数中 both 保证可用。
我现在明白了……只有当数据从外部调用返回时，内部调用才会运行。很抱歉造成混乱。

【解决方案3】：

您可以使用 d3 queue 同时加载文件。一个例子；

d3.queue()
.defer(d3.csv, "file1.csv")
.defer(d3.csv, "file2.csv")
.await(function(error, file1, file2) {
    if (error) {
        console.error('Oh dear, something went wrong: ' + error);
    }
    else {
        doStuff(file1, file2);
    }
});

【讨论】：

这也适用于 json 吗？例如``` d3.queue()/* 加载多个数据集 */ .defer(d3.json, "data1") .defer(d3.json, "data2") .await(function(error, data1, data2) { if (error) { console.log('Something went wrong: ' + error); } else { //图的东西 } });```
这样做的好方法！

【解决方案4】：

回答你的第 3 部分，

有没有办法从csv文件中选择某一列来进口？

不，您不能加载 CSV 的一部分。但是，您可以加载整个 CSV 文件并有选择地使用其中的一列。您可以参考data.newVer 使用newVer 列数据。

【讨论】：