如何在c3.js图表中添加标题

18

有没有人可以建议我如何给C3.js的线性图和柱状图添加标题?我已经找到了以下示例,但它只适用于仪表图。对于任何C3图表,是否有设置图表标题的选项?

donut: {
  title: 'Title'
}
4个回答

55

1
注意:需要版本0.4.11。 - Waylon Flinn
完美运行 - Bhargav Patel
关于对齐方式呢?(居中/左对齐/右对齐) - Peter Krauss

9

如果需要添加图表标题,则需要使用D3。可以使用以下代码:

d3.select("svg").append("text")
    .attr("x", 100 )
    .attr("y", 50)
    .style("text-anchor", "middle")
    .text("Your chart title goes here");

5

我将使用以下代码制作我的图表。

代码:

var chart = c3.generate({
        data: {
            columns: [
                ['Monday', 70],
                ['TuesDay', 20],
                ['Wednesday', 30],
                ['Thursday', 50],
                ['Friday', 100]
            ],
            type: 'donut'
        },
        donut: {
            title: "usage "
        }
    });

结果:

我的代码的结果


3

我也找不到方法,最终把标题作为单位并编辑标签。

gauge: {
        label: {
            format: function(value, ratio) {
                return "%"+value;
            },
            show: true // to turn off the min/max labels.
        },
    min: 0, 
    max: 100, 
    units: "Overall Profit"
//    width: 39 // for adjusting arc thickness
    },

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接