javascript - C3.js圆环图添加多个标题

Question

有什么方法可以在我的圆环图中包含多个标题吗？我正在使用 c3.js 创建下面的图表:

我想在图表中的“天数”下方再添加一个名为“分数”的字段。

下面是代码:

var chart = c3.generate({
        data: {
            columns:[
                     ['First Part ', 54],
                     ['Second Part ', ' '+ 24],
                     ['Third Part ', ' ' + 22]
            ],
            type: 'donut',
            colors: {
                data1: '#ff0000',
                data2: '#00ff00',
                data3: '#0040ff'
                },                                      
            },
            donut: {
               expand: false,
               title: 'Days 28'
                //want to add 'Score' to the title so it appears on the line below "Days 28"
            }
});

谢谢!

Answer 1

donut 中心的标题属于一个名为 c3-chart-arcs-title 的类。因此，您只需向其附加一个 tspan 即可:

d3.select(".c3-chart-arcs-title")
    .append("tspan")
    .attr("dy", 16)
    .attr("x", 0)
    .text("Score");

检查这个 fiddle :https://fiddle.jshell.net/0vuombw4/ (PS:这个 fiddle 不是我的，我只是用它来附加额外的文本)。