Chart.js 3.3.2版本如何修改x轴、y轴及顶部标签的文本颜色为白色

Chart.js 3.x对配置结构做了大幅重构，旧版本的配置项已经失效，你需要按如下规则修改配置：

• 顶部图例标签文字颜色：在options.plugins.legend.labels中配置color: 'rgb(255,255,255)'
• x轴刻度文字颜色：在options.scales.x.ticks中配置color: 'rgb(255,255,255)'
• y轴刻度文字颜色：在options.scales.y.ticks中配置color: 'rgb(255,255,255)'
• 如果需要修改x/y轴的轴标题颜色，可在对应轴的title配置项中添加color: 'rgb(255,255,255)'

修改后的完整配置如下，你可以直接替换你现有代码中的options部分：

options: {
    plugins: {
        legend: {
            labels: {
                color: 'rgb(255,255,255)' // 顶部图例文字颜色
            }
        }
    },
    scales: {
        x: {
            grid: {
                display: false
            },
            ticks: {
                color: 'rgb(255,255,255)' // x轴刻度文字颜色
            }
        },
        y: {
            grid: {
                display: false
            },
            beginAtZero: true,
            ticks: {
                color: 'rgb(255,255,255)' // y轴刻度文字颜色
            }
        }
    }
}

如果有自定义轴标题的需求，可以参考如下示例给对应轴添加配置：

x: {
    grid: {
        display: false
    },
    ticks: {
        color: 'rgb(255,255,255)'
    },
    title: {
        display: true,
        text: '日期',
        color: 'rgb(255,255,255)'
    }
}

内容的提问来源于stack exchange，提问作者RAT