title: nested donuts, partial sum of the values in the 2nd dimension array
body: <p>Is this possible? The reason I am asking the question is first I did the concentric donuts with 2 datasets and the slices size did not match related data it was each proportionate but slightly smaller on the inner ring and I want the slices to match inner and outer. So I read you need nested dataset.
  I need the pie slices of the first 2 values of apples to match the first 2 slices of  the inner and outer donuts. Then I need the total value of the remaining  apples to be one slice and it needs to match the same individual pie slices of the rest of the first array.  So the client just wants to compare the summed values or see it as only 3 slices compared to the 5 slices.
  I used the working apples and oranges  JSfiddle to start with from the internet: <a href="https://jsfiddle.net/vgq0z5aL/" rel="nofollow noreferrer">https://jsfiddle.net/vgq0z5aL/</a><br />
  I modified it here to use the dataset that will work with my problem but couldn't get it to work. Something wrong with the dataset I think?
  My  Example:  <a href="https://jsfiddle.net/aumnxjc8/" rel="nofollow noreferrer">https://jsfiddle.net/aumnxjc8/</a>
  How can I fix the dataset so it works?</p>
  <pre><code>       var dataset = {
        apples: [13245, 28479, 1000, 1000, 3000],
        apples2: [dataset[0][0], dataset[0][1], sumofapples],
        };
  </code></pre>
  <p>var sumofapples = dataset[0][3]+ dataset[0][4]+dataset[0][5];</p>
  <pre><code>    var width  = d3.select('#duration').node().offsetWidth,
          height = 300,
          cwidth = 33;
      
      var colorO = ['#1352A4', '#2478E5', '#5D9CEC', '#A4C7F4', '#DBE8FB'];
      var colorA = ['#58A53B', '#83C969', '#A8D996'];
                      
      var pie = d3.layout.pie()
          .sort(null);
      
      var arc = d3.svg.arc();
      
      var svg = d3.select(&quot;#duration svg&quot;)
          .append(&quot;g&quot;)
          .attr(&quot;transform&quot;, &quot;translate(&quot; + width / 2 + &quot;,&quot; + height / 2 + &quot;)&quot;);
  
      console.log(dataset);
      var gs = svg.selectAll(&quot;g&quot;).data(d3.values(dataset)).enter().append(&quot;g&quot;);
      var path = gs.selectAll(&quot;path&quot;)
          .data(function(d, i) { return pie(d); })
          .enter().append(&quot;path&quot;)
          .attr(&quot;fill&quot;, function(d, i, j) {
              if (j == 0) {
                  
                  return colorO[i];
          
              } else {
                  
                  return colorA[i];
                  
              }
          
          })
          .attr(&quot;d&quot;, function(d, i, j) {
              if (j == 0) {
                  
                  return arc.innerRadius(75 + cwidth * j - 17).outerRadius(cwidth * (j + 2.9))(d);
                  
              } else {
                  
                  return arc.innerRadius(75 + cwidth * j - 5).outerRadius(cwidth * (j + 2.5))(d);
                  
              }
              
          
          });
  </code></pre>