Accepted answer

d3 v5 uses the fetch API and returns a promise requiring the below code.

  .then(function(data) {
      // data is now whole data set
      // draw chart in here!
     // handle error   

In case in the future people want v4. d3 v4 on the other hand uses the XMLHttpRequest method, and does not return a promise requiring this code

d3.csv('yourcsv.csv', function(data) {
    //whole data set
    // draw chart here

csv loading is async so make sure to run your chart code within the csv function.


@pmkro's answer is good, but if you want to use ES7 async/await instead of Promise.then:

async function doThings() {
  const data = await d3.csv('yourcsv.csv');
  // do whatever with data here


Related Query