D3 version 4 basic pie chart
Switch branches/tags
Nothing to show
Clone or download
Latest commit d9529b6 Aug 30, 2017
Permalink
Failed to load latest commit information.
README.md updated readme image Aug 30, 2017
index.html altered layout Aug 30, 2017

README.md

D3 v4 Basic Pie Chart

Adapted from tutorial on http://www.cagrimmett.com/

A simple pie chart.

gh-pages demo

  • The first Pie Chart counts the number of each category that exist.
var category_count = d3.nest()
  .key(function(d) {
    return d.category;
  })
  .rollup(function(leaves) {
    return leaves.length;
  })
  .entries(data);

var category_arcs = d3.pie()
  .value(function(d) {
    return d.value;
  })
  (category_count);
  • The second Pie Chart sums the value in each category.
var category_sum = d3.nest().key(function(d) {
    return d.category;
  })
  .rollup(function(leaves) {
    return d3.sum(leaves, function(d) {
      return d.value;
    });
  }).entries(data)
  .map(function(d) {
    return {
      Category: d.key,
      totalValue: d.value
    };
  });

var category_sum_arcs = d3.pie()
  .value(function(d) {
    return d.totalValue;
  })
  (category_sum);

screen shot 2017-08-30 at 23 51 23