Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Importing data from multiple csv files in D3

Tags:

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:

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?

csv 1
time,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

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

like image 370
John M. Avatar asked Feb 18 '14 01:02

John M.


People also ask

How do I import a CSV file into d3 JS?

D3 provides the following methods to load different types of data from external files. Sends http request to the specified url to load . csv file or data and executes callback function with parsed csv data objects. Sends http request to the specified url to load .

Is d3 CSV async?

d3. csv is asynchronous by design to prevent pages from freezing up, so that can't be changed without changing the d3 library itself. However, you could pre-load all your files via d3.


1 Answers

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

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()

like image 93
Abang F. Avatar answered Sep 28 '22 01:09

Abang F.