Passing an object containing an array to D3

Question

I'm attempting to pass the following data structure into D3, specifically the pie layout.

var myData = {
myValue : "foo",
myArray : [
    {animal : "cat", noise : "meow", cost : 200},
    {animal : "dog", noise : "woof", cost : 300}
  ]
}

I am unable to pass the array portion into d3 using dot notation, for example:

//Passing of data to pie omitted
var pie = d3.layout.pie()
                  .value(function(d){
                    return d.myArray.cost;
                  });

Can someone supply a bl.ocks example or tutorial that works with this use case?

AmeliaBR · Accepted Answer · 2014-04-01 20:50:28Z

2

You're two code snippets don't seem to go together, so this might not be what you want. Update with a complete, simplified (and working except for this problem) program.

That said: the value accessor function of the pie layout is the function that is called on each element of your array to access the number representing the size of that pie slice, not on the data object to extract the array.

You have to yourself extract the array from the complete data object before calling the pie function. E.g., if your data objects are bound to separate pieChart <g> elements, you would use:

var pieSlices = pieChart.selectAll("path.pieSlices")
                   .data( function(d){return pie(d.array);} );
                   //`d` in a data function is the data joined to the parent;
                   //the function must return an array of data for children.

answered Apr 1, 2014 at 20:50

AmeliaBR

27.6k6 gold badges90 silver badges123 bronze badges

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

1 Comment

Thomas Murphy Over a year ago

I'll update the example for posterity, but this is the exact bit of logic I was missing.

Collectives™ on Stack Overflow

Passing an object containing an array to D3

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related