D3 Components

Sunburst Chart

<div id="sunburst-chart-default"></div>
<div id="sunburst-chart-sorted"></div>

<script>
  d3.json('../data/arxiv-categories.json', function (data) {
    d3.shuffle(data);
    d3.sunburstChart(data, { id: 'sunburst-chart-default' });
    d3.sunburstChart(data, {
      id: 'sunburst-chart-sorted',
      sort: 'descending(count)',
      donut: {
        show: true
      },
      tooltip: {
        html: function (d) {
          var category = d.data.category;
          var count = d.data.count;
          var total = (d.parent || d).data.count;
          var percent = (100 * count / total).toPrecision(3) + '%';
          return category + ': ' + count + ' (' + percent + ')';
        }
      }
    });
  });
</script>