Your CSV should not be a one liner

Should be like this:


then you can read the csv like this

 d3.csv("data.csv", function(error, data) {
    var parseDate = d3.time.format("%d-%b-%y");
    data.forEach(function(d) { = parseDate.parse(;
      d.close = +d.close;

working code here


Let's start from the beginning ... I was trying to read the local csv data.csv from the same folder as my html containing the D3 script. That didn't work because there are built in browser security measures that prevent you from reading from your local machine. Without realizing that was what was causing an issue, I read other SO answers that led me to write my own node server to locally serve up my html and csv. That's when the bug that led me to create this SO question occurred.

The problem now was that when my D3 script was trying to read data.csv, it was reading the html file the D3 script was contained in; D3 was read in basic_chart.html instead of data.csv. That's why I was getting an object with key-value pairs describing an html file rather than a csv. I determined this had something to do with my server script but instead of rewriting the server script, I used the best answer from D3.js loading local data file from file:/// and served up my html and csv by typing python -m SimpleHTTPServer 8888 & on the command line while inside the target files' folder. It worked. Hope this helps someone else out. Thanks for your help @Cyril.

Related Query

More Query from same tag