Chart.js雷达图文本颜色修改及轴样式调整求助

以下是满足你需求的修改后的完整代码：

new Chart(ctx, {
    type: 'radar',
    data: {
        labels: {{ subjects|safe }},
        datasets: [{
            label: '2022 Noten',
            data: {{ grades_avg }},
            borderWidth: 1
        }, {
            label: '2021 Noten',
            data: [],
            borderWidth: 0.5
        }]
    },
    options: {
        responsive: true,
        maintainAspectRatio: false,
        scales: {
            r: {
                min: 1,
                max: 6,
                ticks: {
                    stepSize: 0.5,
                    color: 'white', // 设置轴刻度数字为白色
                    borderWidth: 0  // 移除轴刻度数字的边框
                },
                grid: {
                    color: 'gray'
                },
                angleLines: {
                    color: 'gray'
                },
                pointLabels: {
                    color: 'white' // 设置雷达图角度标签（科目名称）为白色
                }
            }
        },
        plugins: {
            title: {
                display: true,
                text: 'Noten im Vergleich',
                color: 'white' // 设置图表标题为白色
            },
            legend: {
                labels: {
                    color: 'white' // 设置图例文本为白色
                }
            }
        }
    }
});

关键修改说明： #

• 所有文本改为白色：分别在标题、图例、轴标签、刻度数字的配置项中设置color: 'white'，覆盖默认的黑色文本。
• 移除轴数字边框：在scales.r.ticks中添加borderWidth: 0，取消刻度数字的边框显示。
• 优化配置结构：把原来独立的scale配置合并到scales.r下，符合Chart.js v3及以上版本的配置规范，避免冗余定义。

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