d3.js chart from json object

Question

I'd like to create a simple pie chart in d3.js. The request response that I'm working with looks like this:

{"record":[{"status":"request"},{"status":"requirements"},{"status":"request"}]};

From what I've seen in examples, I need to convert that object to this:

[{"label":"Request", "value":2}, {"label":"Requirements", "value":1}];

I'm happy to use d3 functions or underscore or straight javascript to accomplish this, I just haven't been able to crack it on my own. Any help would be much appreciated!

mdml · Accepted Answer · 2015-01-19 18:27:27Z

2

You can use d3.nest() to reformat your data:

var data = d3.nest()
    .key(function(d){ return d.status; })
    .rollup(function(leaves){ return leaves.length; })
    .entries(input.record)
    .map(function(d){ return {label: d.key, value: d.values}; });

answered Jan 19, 2015 at 18:27

mdml

23k8 gold badges61 silver badges66 bronze badges

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

3 Comments

user1911141 Over a year ago

Thanks for the reply mdml! So using: var response = {"record":[{"status":"request"},{"status":"requirements"},{"status":"request"}]}; var data = d3.nest() .key(function(d){ return d.status; }) .rollup(function(leaves){ return leaves.length; }) .entries(response.record) .map(function(d){ return {label: d.key, value: d.values}; }); console.log(data); I'm getting an error: "Unexpected value translate(NaN,NaN) parsing transform attribute"

mdml Over a year ago

Glad to help. So my answer reformatted your data correctly, but there's an issue using that data for your plot? I can't tell what's going on without seeing your code. Maybe you can post another question with the code for your plot.

user1911141 Over a year ago

No, you nailed it. Stupid library error on my part. Thanks!!

Collectives™ on Stack Overflow

d3.js chart from json object

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related