CODEWITHSUNDEEP
javascriptd3.jsxmlhttprequestqueue
Ian H
Ian H

Reputation: 542

Using D3 Queue to make a cross site call

I have my queue setup like

queue()
.defer(d3.json, "js/US.json")
.defer(d3.json, "http://192.168.1.40:8080/api/2014", function(d) { dataSet.set(d.id, +d.plant); })
.defer(d3.csv, "data/ph.csv", function(d) { phById.set(d.id, +d.ph); })
.awaitAll(ready);

However, my ready function is never called. I have no errors in my console. I've done checks to make sure my data is being returned and that my dataSet is loaded with the proper data. I'm not understanding why my queue never calls my ready function. Any direction here would be really appreciated.

Upvotes: 0

Views: 686

Answers (1)

Andrew Guy
Andrew Guy

Reputation: 9978

The queue.defer() function passes an additional callback argument to the task function passed to it, which must be called by the task function upon completion. In your case, you are calling the d3.json task function, and handing it two arguments, plus the additional callback argument (thanks to queue.defer).

The d3.json method expects two arguments - a url and a callback. It will receive three arguments, but only use the first two. As such, the callback function from queue.defer() won't be invoked, and the queue.awaitAll() function never sees the tasks as completed.

You need to pass the results from each .json and .csv task to a final callback function:

queue().defer(d3.json, "js/US.json")
       .defer(d3.json, "http://192.168.1.40:8080/api/2014")
       .defer(d3.csv, "data/ph.csv")
       .awaitAll(ready);

function ready(error, result1, result2, result3) {
  //do some things with your results here - these are the results passed
  //from each task.
}

Upvotes: 1

Related Questions