CODEWITHSUNDEEP
javascriptd3.jsasync-awaitdeferred
Jakob Vinther
Jakob Vinther

Reputation: 61

d3.queue.await function not invoked

Why is the .await function not invoked in this very little example?

http://jsfiddle.net/x2fkvsco/

HTML

<h1>test</h1>
<div id="a"></div>
<div id="b"></div>

JS

d3.queue()
   .defer(a,1)
   .await(b,2);

function a(x){
    d3.select('#a').text("a is executing with x="+x);
}

function b(err,x){
   d3.select('#b').text("b is executing with x="+x);
}

Output

test
a is executing with x=1

Upvotes: 1

Views: 1447

Answers (2)

Mark
Mark

Reputation: 108567

@altocumulus beat me to it with his insightful comment, but since an example speaks a thousand words:

<!DOCTYPE html>
<html>

<head>
  <script src="https://d3js.org/d3.v4.min.js"></script>
</head>

<body>
  <h1>test</h1>
  <div id="a"></div>
  <div id="b"></div>
  <script>
    var q = d3.queue()
      .defer(a, 1, 2)
      .await(b);

    function a(x, y, callback) {
      d3.select('#a').text("a is executing with x=" + x);
      callback(null, y);
    }

    function b(err, x) {
      d3.select('#b').text("b is executing with x=" + x);
    }
  </script>
</body>

</html>

Upvotes: 5

altocumulus
altocumulus

Reputation: 21578

It's in the first sentences of the docs:

the callback must be invoked by the task when it finishes.

To comply with the API you need to invoke the callback, which is supplied as the last parameter to your function a():

function a(x, callback) {
  d3.select('#a').text("a is executing with x="+x);
  callback(null, { /* result */ });   
}

Upvotes: 4

Related Questions