Broken Donut D3
HTML
<script src="//d3js.org/d3.v3.min.js"></script>
<div id="sunday"></div>
JavaScript
var data = {total_s: 22, total_l: 74, total_a: 67};
var data = d3.entries(data);
console.log ("data", data);
var height = 250
, width = 250
, color = d3.scale.ordinal().range(["#98abc5", "#8a89a6", "#7b6888"])
, radius = Math.min(width, height) / 2
;
var arc = d3.svg.arc()
.outerRadius(radius)
.innerRadius(radius - 10);
var pie = d3.layout.pie()
.value(function(d){return d.value;})
.sort(null)
var svg3 = d3.select("#sunday")
.append("svg:svg")
.attr("width", width)
.attr("height", height * .5)
.append("g")
.attr("transform", "translate(" + (width/2) + "," + (height/2) + ")")
var path = svg3.selectAll('path')
.data(pie(data))
.enter()
.append("path")
.attr("d", arc)
.attr("fill", function(d){return color(d.data.key)});