d3 csv readin to objects in array

Question

I am currently trying to use the d3 framework for a university visualisation approach. For testing purpose I want to read a csv-file and parse the rows to objects inside an array.

My csv looks like:

 ID, Referred To, TimeStamp, Votes, Comment

So I want to read it with the following lines:

d3.csv("test_comments.csv", function(data) {
  commentlist = data.map(function(d) {
    return[+d["ID"],
           +d["Referred To"],
           +d["TimeStamp"],
           +d["Votes"],
           +d["Comment"]
          ]
  });
});

But if I want to readout the values afterwards I am just getting "undefined" I also tried the way mbostock described in this thread: csv to array in d3.js

but working with a global variable is not working either.

var commentlist;
d3.csv("test_comments.csv", function(data) {
  commentlist = data.map(function(d) {
    return[+d["ID"],
           +d["Referred To"],
           +d["TimeStamp"],
           +d["Votes"],
           +d["Comment"]
          ]
  });
});
console.log(commentlist);

Am I understanding something wrong? Maybe you have a solution for me.

Do you have spaces in your CSV like in the headers? Then remove those. Also I'm guessing converting "comment" to a number doesn't make sense. — Lars Kotthoff
– Lars Kotthoff, Commented Jul 21, 2014 at 12:54
yes but just in the comment section, the Idea is a new visualisation of social network comments. So I wanted to store the comments inside of a csv, isnt that possible ? — hGen
– hGen, Commented Jul 21, 2014 at 12:57
Sure, but your code is converting everything in the CSV into numbers, which doesn't make sense if you have strings in there. — Lars Kotthoff
– Lars Kotthoff, Commented Jul 21, 2014 at 13:05
OkayI understand, which char do I have to use to convert to Strings? — hGen
– hGen, Commented Jul 21, 2014 at 13:13

saikiran.vsk · Accepted Answer · 2014-07-21 12:54:51Z

1

var commentlist=[];
d3.csv("test_comments.csv", function(data) {
  commentlist=data;
});
console.log(commentlist);

What I know is, In the call back data object will contain array of JSON objects of csv file's all rows of data, that each row data is pushed as a JSON format into the data array. As below

[{"ID": valueFromtheRow, "Referred To": value, "TimeStamp": value, "Votes":value, "Comment":value}]

The call back function is called by passing the array of JSONs. So data object will look like

data=[{"ID": valueFromtheRow, "Referred To": value, "TimeStamp": value, "Votes":value, "Comment":value}];

Hope you understood...If not ask me.

edited Jul 21, 2014 at 12:54

answered Jul 21, 2014 at 12:29

saikiran.vsk

1,7961 gold badge10 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

hGen Over a year ago

Thanks that is another try, but I want to access for instance console.log(commentlist[1]) I get undefined as return.

chaitanya89 Over a year ago

@hGen CSV function in d3 is asynchronous, commentlist[1] is undefined, probably the csv file is not loaded yet and data in csv file is yet to be assigned to commentlist variable.

Fei Wang · Accepted Answer · 2015-08-20 07:20:27Z

1

I think the reason you got { console.log(commentlist) } undefined is that inside d3.csv the callback function is parsed and called last by browser, and { console.log(commentlist) } is called earlier even though it appears at the bottom of your code. So the moment when { console.log(commentlist) } is called, { commentlist } is actually undefined (only declared). That being said, just try putting { console.log(commentlist) } inside the callback and it should do the job.

answered Aug 20, 2015 at 7:20

Fei Wang

111 bronze badge

1 Comment

TravelTrader Over a year ago

I had this problem, too. But outside d3.csv I need the "commentlist"-variable for other usage. Is there a possibility to run the d3.csv before another function?

Collectives™ on Stack Overflow

d3 csv readin to objects in array

2 Answers 2

2 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related