apply d3.nest rollup to nested pie chart (to vary the size of the pies)

Question

I'd like to modify Mike Bostock's nested pies example http://bl.ocks.org/mbostock/1305337 to have different pie sizes per the number of flights in each airport; to have a visual idea of how busy each airport is. My guess is to sum up the number of flights via .rollup(function(leaves) { return {"total_flights": d3.sum(leaves, function(d) {return +(d.flights);})} }) (from http://bl.ocks.org/phoebebright/raw/3176159/) and apply it somehow to r (radius) but as I'm still learning, I don't know where to inject it.

Appreciate your tips/help.

Answer 1

Create an object w/ each origin's total flights:

var totalFlights = {};
airports.forEach(function(d){
  totalFlights[d.key] = d3.sum(d.values.map(function(d){ return +d.count; }));
});

Size the arcs based on their origin's total flights:

 var arc = d3.svg.arc()
    .innerRadius(function(d){ return totalFlights[d.data.origin]/952 * r / 2; })
    .outerRadius(function(d){ return totalFlights[d.data.origin]/952 * r; });

952 is a bit of a magic number here, set equal to the max number of flights from an airport. Ideally, you'd use a scale instead.

Working example: http://bl.ocks.org/1wheel/6471631