svg - c3.js donut chart : Making the separator line visible on a 100% arc?

Question

我正在尝试在 c3.js 中设置 donut chart 的样式，当圆弧是圆环的 100% 时，对于除最后一个类别之外的每个圆弧，圆环顶部会显示一条细白线。在最后一个类别中，这条线丢失了，我们正试图让它显示出来，以便图表看起来一致。我已经对 .c3-chart-arc 的笔画风格进行了一些尝试。类，但一直没有任何运气。有没有办法让这个细线分隔符显示在圆环图的最后一个类别上？

Answer 1

只有一个值， donut 实际上是一个 donut - 两个圆圈 - 中间的区域已填充，因此无法影响 donut 的绘图属性以获得您想要的效果。

hacky 的答案虽然(使用 c3 的内部属性)是在设置这样的图表后，您可以像这样从图表的中心附近直接画一条线来模仿效果:

d3.select(".c3-chart-arcs").append("line")
    .attr ({x1: 0, y1: -20, x1: 0, y1: -chart.internal.currentHeight / 2})
    .style ("stroke", "white")
;