D3 Examples - Basic pie chart in d3

xxxxxxxxxx
 
<html>
  <body>
    <head>
    My Pokemon
    </head>
    <div id="chart"></div>
    <script src="https://d3js.org/d3.v3.min.js"></script>
    <script>
      (function(d3) {
        'use strict';
​
        var dataset = [
          { label: 'pikachu', count: 10 }, 
          { label: 'charmander', count: 20 },
          { label: 'bulbasaur', count: 30 },
          { label: 'squirtle', count: 40 }
        ];
​
        var width = 500;
        var height = 500;
        var radius = Math.min(width, height) / 2;
​
        var color = d3.scale.ordinal().range(['#ffff00', '#ff0000', '#00ff00', '#0099ff']);
​
        var svg = d3.select('#chart')
          .append('svg')
          .attr('width', width)
          .attr('height', height)
          .append('g')
          .attr('transform', 'translate(' + (width / 2) + 
            ',' + (height / 2) + ')');
​
        var arc = d3.svg.arc()
          .outerRadius(radius);
​
        var pie = d3.layout.pie()
          .value(function(d) { return d.count; })
          .sort(null);
​
        var arc = d3.svg.arc()
          .outerRadius(radius - 10)
          .innerRadius(0);
​
        var path = svg.selectAll('path')
          .data(pie(dataset))
          .enter()
          .append('path')
          .attr('d', arc)
          .attr('fill', function(d, i) { 
            return color(d.data.label);
          });
​
​
      })(window.d3);
    </script>
  </body>
</html>
    