Javascript 如何设置ChartJS x轴标题

我们使用Chartjs绘制图表，但是没有给出x轴标题，中的y轴标题有一个解决方案，但对于x轴，我可以添加x轴名称，但无法在图表下方创建空间以正确放置，使用y作为this.chart.height将文本与x轴标题重叠

---

我看过chartjs v2.0，但它也不支持x轴标题。

我们根据x轴标签的高度设置图表的高度，然后在该空间中写入

我们不必在

draw

覆盖中执行任何操作，因为画布清理也是基于高度（我们调整的高度）进行的

预览

---

脚本

Chart.types.Line.extend({
    name: "LineAlt",
    initialize: function (data) {
        this.chart.height -= 30;

        Chart.types.Line.prototype.initialize.apply(this, arguments);

        var ctx = this.chart.ctx;
        ctx.save();
        // text alignment and color
        ctx.textAlign = "center";
        ctx.textBaseline = "bottom";
        ctx.fillStyle = this.options.scaleFontColor;
        // position
        var x = this.chart.width / 2;
        var y = this.chart.height + 15 + 5;
        // change origin
        ctx.translate(x, y)
        ctx.fillText("My x axis label", 0, 0);
        ctx.restore();
    }
});

然后

...
new Chart(ctx).LineAlt(data);

---

---

Fiddle-

需要在这上面给你reddit gold！在第5.2节中，可以看到以下答案：