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

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/21842384/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 21:48:31  来源:igfitidea点击:

Importing data from multiple csv files in D3

javascriptarrayscsvimportd3.js

提问by John M.

I am brand new to D3 and just started working on an a project. My question is this. I want to import data from 2 csv files in D3 to use them for graph comparisons. The problems I am facing are:

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

1.How do I import data from multiple csv files.
2.Can I use one array for each csv or does D3 use only one global data array?
3.Is there a way to choose a certain column from the csv files to import?

Here is an example, I want to import the "oldVer" from each of the files in separate arrays and then use the 2 arrays to work with. Is that posible in D3 and how?

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

这是一个示例,我想从单独数组中的每个文件中导入“oldVer”,然后使用 2 个数组进行处理。这在 D3 中可行吗?

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

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

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

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

Again sorry for the dumb question but I have found little feedback on this matter. Any help will be appreciated.

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

回答by Abang F.

In d3 version 5, you can use Promise.allto load multiple csv files. Example:

在 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

有关在 d3 v5 中加载 csv 的更多信息

More info about Promise.all()

更多信息 Promise.all()

回答by Lars Kotthoff

You simply call d3.csvseveral times:

您只需调用d3.csv几次:

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

As for your third question, no, D3 will parse everything. There's nothing forcing you to use all the data though, so if you're interested in only one column, just use the data from that.

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

回答by Stuart Hallows

You could use a d3 queueto load the files simultaneously. An example;

您可以使用 d3队列同时加载文件。一个例子;

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);
    }
});

回答by travelsize

To answer your part 3,

回答你的第 3 部分,

  1. Is there a way to choose a certain column from the csvfiles to import?
  1. 有没有办法从csv文件中选择某一列进行导入?

No, you cannot load in part of a CSV. You can, however, load in the entire CSVfile and selectively use one column from it. You can refer to data.newVerto utilize the newVercolumn data.

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