javascript - D3.js multiple pie chart resizing -

i'm adding d3 pie charts svg map chart, , anchoring them city lat + lon coordinates. that's working fine. i'm struggling change size of each pie chart dependent on 'value' in data.

can me understand how can change arc variable each item believe responsible radius of each pie chart? i've tried number of different approaches i've found in searches here, bar rewriting of code in order pie charts in, i'm hoping it's possible here?

here's portion of code creates , adds pie charts:

// add piecharts map         // need implement         // not sure how each pie chart         // d3.svg.arc().innerradius(0).outerradius(d.value)          var arc = d3.svg.arc().innerradius(0).outerradius(15),                            pie = d3.layout.pie()             .value(function(d){                  return d });            var pies = svg.selectall('.pie')             .data(data)             .enter()             .append('g')             .attr('class', 'pie')             .attr("transform", function(d) {               return "translate(" + projection([d.lon, d.lat])[0] + "," + projection([d.lon, d.lat])[1] + ")";             });            var color = d3.scale.ordinal().range(["#3f71b0", "#e11c42"]);             pies.selectall('.slice')             .data(function(d){                 return pie([d.value, d.subset]); })             .enter()             .append('path')             // think need implement loop             .attr('d', arc)             .style('fill', function(d,i){               return color(i);             })             .style("opacity", 1)             .style("stroke", "#fff")             .style("stroke-width", "1.5"); 

thanks in advance advice!

-dt