图表 JS - 如果没有可用数据,则在清除 canvas 时缺少标题

Chart JS - Title missing when clearing canvas if no data is available

编辑 - 下面的答案工作正常,除了删除 chart.clear() 之外我所做的就是隐藏图例和 x/y 轴。

现在有什么可能导致文本模糊的想法吗?

我确定我正在做一些非常愚蠢的事情,但我似乎无法弄清楚这一点。

我有以下全局插件,它会在适用时显示“没有要显示的数据”消息:

Chart.plugins.register({
  afterDraw: function(chart, args, options) {
    if (chart.data.datasets.every(dataSetContainsNoData)) {
        debugger;
        var ctx = chart.chart.ctx;
        var width = chart.chart.width;
        var height = chart.chart.height;
        chart.clear();

        ctx.save();
        ctx.textAlign = 'center';
        ctx.textBaseline = 'middle';
        ctx.fillText('No data to display', width / 2, height / 2);
    }
}
});

但是,我想将此图表的标题显示在顶部,但不知道该怎么做。如果我检查 chart.chart.options 标题选项设置了文本,并且显示标志设置为 true

以下是实际图表上的选项。

options: {
        title: { display: true, text: 'Chart Header Text' },
        responsive: true,
        maintainAspectRatio: false,
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero: true
                }
            }]
        }
    }

非常感谢任何帮助!

您需要注释掉 chart.clear() 并且标题应该有效。