D3.js donut chart

HTML

<script src="http://d3js.org/d3.v3.min.js"></script>

JavaScript

var dataset = {
  apples: [532, 284],
};

    var degree = Math.PI/180;
    
    var width = 460,
        height = 300,
        radius = Math.min(width, height) / 2;
    
    var color = d3.scale.category20();
    
    var pie = d3.layout.pie().startAngle(-90*degree).endAngle(90*degree)
        .sort(null);
    
    var arc = d3.svg.arc()
        .innerRadius(50)
        .outerRadius(100);
    
    var svg = d3.select("body").append("svg")
        .attr("width", width)
        .attr("height", height)
        .append("g")
        .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");

    var path = svg.selectAll("path")
        .data(pie(dataset.apples))
      .enter().append("path")
        .attr("fill", function(d, i) { return color(i); })
        .attr("d", arc);   


window.setInterval(dummyData, 2000);

function dummyData(){
    var num = Math.floor(Math.random() * 100);
    var key = Math.floor(Math.random() * dataset.apples.length);
    
    dataset.apples[key] = num;
    
    draw();
};

function draw(){     
    svg.selectAll("path")
        .data(pie(dataset.apples))
    .transition()
    .duration(2500)
        .attr("fill", function(d, i) { return color(i); })
        .attr("d", arc);   
}