javascript - c3.js : How to rotate the labels above the bar-chart bar items?

Question

/image/Lpsom.png

如何旋转这些值？ (打开上面的链接)我正在使用 c3.js 的最新版本。 感谢您的帮助。 简单示例:

var chart = c3.generate({
    data: {
        columns: [
            ['Value', 30, 200, 100, 400, 150, 250],
        ],
        type: 'bar',
        labels: true
    },
});

Answer 1

没有像轴标签那样的 c3 设置，但您可以使用 onrendered 中的一些 d3 代码来旋转它们。回调:

onrendered: function () {
    d3.selectAll(".c3-chart-texts text.c3-text")
        .attr("transform", function(d) {
            var textSel = d3.select(this);
            return "rotate(90, "+textSel.attr("x")+", "+(textSel.attr("y"))+")";
        })
        .style("text-anchor", function(d) {
            return (d.value && d.value > 0) ? "end" : "centre";
        })
    ;
}

http://jsfiddle.net/cfjm0gLh/1/