I\'m new to d3.js and I\"m trying to make a Pie-chart with it. I have only one problem: I can\'t get my labels outside my arcs... The labels are positioned with arc.centroid
This was the low-cost answer I was happy with. It pushes all the labels out horizontally (that's where I had the extra space):
g.append("text")
.attr("transform", function(d) {
var pos = arc.centroid(d);
return "translate(" + (pos[0] + (.5 - (pos[0] < 0)) * radius) + "," + (pos[1]*2) + ")";
})
.attr("dy", ".35em")
.style("text-anchor", function(d) {
return arc.centroid(d)[0] > 0 ? "start" : "end";
})
.text(function(d) { return d.label; });