Question

17

How to load data from a CSV file in D3 v5

rated 0 times [ 23] [ 6] / answers: 1 / hits: 30511 / 6 Years ago, sun, april 1, 2018, 12:00:00

I'm trying to load data from a CSV file in D3; I have this code:

function update (error, data) {

    if (error !== null) {

        alert (Couldn't load the dataset!);

    } else {

        //do something

    };



function changeData () {

    d3.csv (data/dataset.csv, update);

}

If I use D3 v4 it works fine, but if I switch to v5 it doesn't work anymore.
Can someone explain to me how to modify the code to make it work with D3 v5?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

emiliano

Add To Favorites

Follow

Total Points: 381

Total Questions: 109

Total Answers: 93

Location: Jersey

Member since Fri, Oct 1, 2021

3 Years ago

emiliano questions

1 Jest: Share Variables Between Test Files

Tue, Sep 1, 20, 00:00, 4 Years ago

1 Promise.all not working with an array of async functions

Sun, Jul 26, 20, 00:00, 4 Years ago

1 Discord.js: Fetch message from ALL channels

Fri, Jun 12, 20, 00:00, 4 Years ago

1 How to spoof a closed google form (...no longer accepting responses)? I want to submit a form after deadline

Thu, Jun 4, 20, 00:00, 4 Years ago

1 concurrently command not found but installed gloabally

Sat, Apr 25, 20, 00:00, 4 Years ago

View All

answered 6 Years ago anitamaeg · Accepted Answer

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

d3.csv('yourcsv.csv')

  .then(function(data) {

      // data is now whole data set

      // draw chart in here!

  })

  .catch(function(error){

     // 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.