0

I am getting the error

Uncaught Reference Error: queue is not defined

but I do not understand why I am getting the error. I am trying to draw a map of the USA using D3 and I am/was using this guide but it does not exactly match with the most modern version of D3. Here is my code/the code from the video:

(function (){

var width = 400;
var height = 300;

var svg = d3.select('#d3mapUS')
        .append("svg")
        .attr("width", width)
        .attr("height", height);

var projection = d3.geoAlbersUsa()
        .scale(1280)
        .translate([width/2, height/2]),
    path = d3.geoPath()
        .projection(projection);

var stateIDMap = d3.map({

});

queue()
    .defer(d3.json, "us.json")
    .await(function (err, US) {
        var states = svg.append("g")
                .attr("class", "states")
                .selectAll("g")
                .data(topojson.feature(US, US.objects.states).features)
                .enter()
                .append("g");

        states.append("path")
                .attr("d", path);
    });
})();
Gerardo Furtado
  • 100,839
  • 9
  • 121
  • 171
Martin Green
  • 27
  • 1
  • 2
  • 6
  • Does your code appear *after* the import of queue.js? The error is pretty self-explanatory. – Pointy Aug 09 '16 at 14:42
  • Is this D3 3.x or 4.x? – Gerardo Furtado Aug 09 '16 at 14:44
  • The import is in the html file that calls this js file. Whenever I use the import, I get an error that the index.js file of the queue has a "required is not defined" error that goes away if I comment it out, but this error stays no matter what. This is D3 4.x – Martin Green Aug 09 '16 at 14:46

2 Answers2

0

is queue part of a library? I'm assuming if you attached it in the html it would work anyway. Make sure it's before you import your code.

but if it's not working or you're worried about compiler errors you can do this:

(function (queue) {
....

})(queue);

I do that when I want to use jquery or window in my iife's.

ThinkBonobo
  • 15,487
  • 9
  • 65
  • 80
0

If you are using D3 v4.x, the correct syntax is d3.queue. So, it should be:

d3.queue()
    .defer(d3.json, "us.json")
    .await(function (err, US) {
        var states = svg.append("g")
            .attr("class", "states")
            .selectAll("g")
            .data(topojson.feature(US, US.objects.states).features)
            .enter()
            .append("g");

        states.append("path")
            .attr("d", path);
});

Check the API: https://github.com/d3/d3-queue#queue

Gerardo Furtado
  • 100,839
  • 9
  • 121
  • 171