Codepen.io: can't do console.log() in d3.csv()

Question

I am trying to read in csv data using d3 in codepen.io and it is not printing me the data, even though it is printing console.log('hello') outside the d3.csv():

d3.csv("http://learnjsdata.com/data/expenses.csv", function(data) {
    console.log(data)
})

I added d3 cdn of course. Whats wrong with codepen.io? How to make it working?

In the debug mode I see that codepen.io does not like that the expenses.csv is loaded over http.

Answer 1

I think it depends on the version of d3 you're using. In d3 v6, they changed from the signature d3.csv(<file>, <callback>) to a promise structure:

d3.csv("http://learnjsdata.com/data/expenses.csv").then(function(data) {
    console.log(data)
}).catch(function(error) {
    console.log(error)
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/6.0.0/d3.min.js"></script>