title: D3 nested group as x-axis
body: <p>How do I use a nested group in D3 as my x-axis?  Is it at all possible. </p>
  
  <p>I am not on my dev machine to post my code example, but for illustrative purposes, let's assume the following code from: <a href="https://stackoverflow.com/questions/32479917/what-is-the-best-way-to-form-age-groups-from-a-list-in-d3">What is the best way to form age groups from a list in D3?</a></p>
  
  <pre><code>var nest = d3.nest()
      .key(function(d) { return d.sex; })
      .key(function(d){
        var ageGroup = null;
        if (d.age &lt;= 10){
          ageGroup = '0-10';
        } else if (d.age &gt; 10 &amp;&amp; d.age &lt;= 20 ){
          ageGroup = '10-20';
        } else if (d.age &gt; 20 &amp;&amp; d.age &lt;= 30 ){
          ageGroup = '20-30';
        } else if (d.age &gt; 30 &amp;&amp; d.age &lt;= 40 ){
          ageGroup = '30-40';
        } else if (d.age &gt; 40 &amp;&amp; d.age &lt;= 50 ){
          ageGroup = '40-50';
        } else if (d.age &gt; 50 &amp;&amp; d.age &lt;= 60 ){
          ageGroup = '50-60';
        } else if (d.age &gt; 60 &amp;&amp; d.age &lt;= 70 ){
          ageGroup = '60-70';
        } else if (d.age &gt; 70 &amp;&amp; d.age &lt;= 80 ){
          ageGroup = '70-80';
        } else if (d.age &gt; 80 &amp;&amp; d.age &lt;= 90 ){
          ageGroup = '80-90';
        } else if (d.age &gt; 90 &amp;&amp; d.age &lt;= 100 ){
          ageGroup = '90-100';
        }
        return ageGroup;
      })
      .entries(myArray);
  </code></pre>
  
  <p>How would I use <code>ageGroup</code> as my x-axis?</p>