размещения этикетка d3 в конце дуг

Question

Учитывая следующий быстрый набор, который строится с помощью дуг в D3:

segmentArc = d3.svg.arc().outerRadius(radius - chartInset).innerRadius(radius - chartInset - barWidth).startAngle(arcStartRad + startPadRad).endAngle(arcEndRad - endPadRad); 

Как переместить метки в каждом сегменте, так что кажется, выравнивание вправо (в конце каждого сегмента, противоположного центру)?

этикетки в настоящее время добавил это нравится:

 chart.append('text') 
      .attr('transform',() => { 

       var x = Math.round(segmentArc.centroid()[0]); 
       var y = Math.round(segmentArc.centroid()[1]); 

       return 'translate(' + x + ',' + y + ')'; 

      }) 
      .style("text-anchor", "middle") 
      .text(sectionLabel); 

Answer 1

Я решил эту проблему путем репликации каждой дуги сегмента, придавая ей прозрачную заливку и делает его ровно в два раза дольше. Оттуда это так же просто, как выработать центроид для прозрачной дуги.