CODEWITHSUNDEEP
d3.js
Thomas Murphy
Thomas Murphy

Reputation: 1468

Passing an object containing an array to D3

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?

Upvotes: 0

Views: 1048

Answers (1)

AmeliaBR
AmeliaBR

Reputation: 27544

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.

Upvotes: 2

Related Questions