Диаграмма пончика D3.js... arc.centroid(d) не подвержена влиянию d.innerRadius и d.outerRadius

Question

Я создаю пончик (или Piechart), и я хочу разместить этикетки за пределами области. Я создал скрипку http://jsfiddle.net/VeeTee/mA3V7/ для этого.

arcs.append("svg:text")
    .attr("transform", function(d) {
        //this is where I want to make a translation to the outside border
        d.innerRadius = radius;
        d.outerRadius = height/2;
        return "translate(" + arc.centroid(d) +")";
    })
    .attr("dy", ".35em")
    .attr("text-anchor", "middle")
    .text(function(d, i) { return d.value.toFixed(2); });

arc.centroid (d) -> всегда дает один и тот же результат (и, следовательно, один и тот же перевод)

Answer 1

Не уверен, что вы подразумеваете под тем, что он всегда дает один и тот же результат, но вы можете разместить метки прямо за пределами графика, умножив координаты центроида на 1,5. Код примерно такой.

.attr("transform", function(d) {
        var c = arc.centroid(d);
        return "translate(" + c[0]*1.5 +"," + c[1]*1.5 + ")";
    })

Обновленный jsfiddle здесь.