2

I'm struggling to assign arrays to CSV files that I've loaded in. I'm using D3's d3.queue() method to load them in, but it seems like they're all being assigned to the same array.. Which isn't what i want.

var csvOne;
var csvTwo;
var csvThree;

var q = d3.queue();
    ['csv1.csv', 'csv2.csv', 'csv3.csv'].map((c) => {
    q.defer(d3.csv, c);
});

q.awaitAll(function(error, csv1, csv2, csv3) {
    csvOne = csv1[0];
    csvTwo = csv2[0];
    csvThree = csv3[0]
});

console.log(csvOne);
console.log(csvTwo);
console.log(csvThree);

Any idea how I can load multiple CSVs at once and assign each of them to separate arrays?

Cheers

Edit to current code based on answer below

var csvOne;
var csvTwo;
var csvThree;

var q = d3.queue();
    ['data/csv1.csv', 'data/csv2.csv', 'data/csv3.csv'].map((c) => {
});

q.awaitAll(function(error, [csv1 , csv2 , csv3]){
    csvOne = csv1;
    csvTwo = csv2;
    csvThree = csv3;
});

console.log(csvOne);
console.log(csvTwo);
console.log(csvThree);

1 Answers1

0

Contrary to queue.await(), which will pass the result of each deferred task as an additional argument to the callback, queue.awaitAll() passes an array of the results as the second argument to the callback.

The solution to your problem is to either use .await():

q.await(function(error, csvOne , csvTwo , csvThree) {
    //...
});

Or, use .awaitAll() and get the individual results from that array:

q.awaitAll(function(error, [csvOne , csvTwo , csvThree]) {
    //...
});

But be aware of the infamous "How do I return the response from an asynchronous call?". The way it is now will inevitably result in a follow-up problem.

altocumulus
  • 21,179
  • 13
  • 61
  • 84