javascript - 将一个居中标签添加到 donut chartist-js

Question

由于我找不到和回答这个问题，我希望它不是重复的。我正在使用 chartist.js，我做了一个简单的 donut ，这非常简单直接，但现在我想禁用标签，它工作正常并在 donut 内添加一个标签(这就是问题所在).不需要，标签会变大，通过图表本身，如果它只是一个新的 div 或其他东西就足够了。

到目前为止我的代码:

<div class="ct-chart1 ct-chart ct-perfect-fourth"></div>

和

new Chartist.Pie('.ct-chart1', {
    labels: [],
    series: [75, 25]
}, {
    donut: true,
    width: '300px',
    height: '200px',
    donutWidth: 30,
    startAngle: 0,
    total: 100
});

我已经尝试使图表本身成为一个 flexbox，并将标签添加为子项并以这种方式居中，但这没有用，我尝试用一​​个新的 div 包围图表，但这样图表就消失了。

<div>
    <div class="ct-chart1 ct-chart ct-perfect-fourth"></div>
</div>

Answer 1

我会使用绘图事件将标签居中放置在图表的中间。检查这个垃圾桶 http://jsbin.com/hipafu/edit?html,css,js,output

还要注意样式:

.ct-label {
  dominant-baseline: central;
  text-anchor: middle;
}