添加多个标题做 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

甜甜圈中心的这个标题属于一个名为c3-chart-arcs-title的类。因此，您可以简单地将tspan 附加到它：

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

检查这个小提琴：https://fiddle.jshell.net/0vuombw4/ （PS：这个小提琴不是我的，我只是用来附加额外的文字）。