I'm trying to create a Chord Diagram using D3.js to show the relationship between different clients and suppliers, but I keep getting the following error when running the page, and here's my code:

Uncaught TypeError: d3.queue is not a function at chord.html:47

      d3.queue()
        .defer(d3.json, 'NewData/Client_Supplier-matrix.json')
        .defer(d3.csv, 'NewData/Client_Supplier.csv')
        .await(function(err, matrix, mmap) { 
          if (err) console.log(err);
          _.each(mmap, function (d, i) { d.id=i; d.data=d.color })
          drawChords(matrix, mmap);
        });

I'm trying to create a Chord Diagram using D3.js to show the relationship between different clients and suppliers, but I keep getting the following error when running the page, and here's my code:

Uncaught TypeError: d3.queue is not a function at chord.html:47

      d3.queue()
        .defer(d3.json, 'NewData/Client_Supplier-matrix.json')
        .defer(d3.csv, 'NewData/Client_Supplier.csv')
        .await(function(err, matrix, mmap) { 
          if (err) console.log(err);
          _.each(mmap, function (d, i) { d.id=i; d.data=d.color })
          drawChords(matrix, mmap);
        });

• javascript
• d3.js
• chord-diagram

2 Answers 2

It seems you are attempting to use D3 v5 to run code designed for D3 v4. According to the D3 5.0 release notes:

D3 5.0 also deprecates and removes the d3-queue module. Use Promise.all to run a batch of asynchronous tasks in parallel, or a helper library such as p-queue to control concurrency.

See this question for an example of how to convert d3.queue to Promise.all.

try this mand npm install d3-queue