Javascript 能否在Chart.js中为不同的轴设置不同的颜色？

我有一个简单的双轴chart.js图表。为了提高可读性，我想对图表和比例数据进行颜色协调。这可能吗

例如，在下面的示例中，我希望左轴上的温度值显示为红色，右轴上的SG值显示为蓝色

我尝试在特定轴选项下添加

fontColor

和

scaleFontColor

选项，但没有成功

这是我的密码：

var canvas=document.getElementById（'myChart'）；
var图表数据={
标签：[‘星期一’、‘星期二’、‘星期三’、‘星期四’、‘星期五’]，
数据集：[{
标签：“温度F”，
yAxisID:'F'，
显示：对，
填充：假，
边框颜色：'#ff6384'，//红色
数据：[100,96,84,76,69]
}, {
//键入：“行”，
标签：“重力”，
yAxisID:'G'，
显示：对，
填充：假，
边框颜色：'#36a2eb'，//蓝色
数据：[1.07,1.055,1.020,1.015,1.012]
}]
};
var myChart=新图表（画布{
键入：“行”，
数据：图表数据，
选项：{
标题：{
显示：对，
短信：“嗯，啤酒！”
},
比例：{
雅克斯：[{
id:'F'，
位置：'左'，
scaleFontColor:“#ff6384”，//红色
滴答声：{
建议民：32，
建议最大值：100
}
}, {
id:'G'，
位置：'右'，
滴答声：{
建议:一,，
建议最大值：1.1
},
网格线：{
drawOnChartArea:false，//只希望显示一个轴的网格线
},
}]
}
}
});
正文{
背景：#20262E；
填充：20px；
字体系列：Helvetica；
}
我想我已经解决了这个问题。当您尝试更改两个Y轴值的颜色时。您需要为特定的
yax
在
ticks
对象中添加
fontColor
属性。然后为
ticks
对象的
fontColor
属性指定任何想要的颜色值

在这里查找更改


var canvas=document.getElementById（'myChart'）；
var图表数据={
标签：[‘星期一’、‘星期二’、‘星期三’、‘星期四’、‘星期五’]，
数据集：[{
标签：“温度F”，
yAxisID:'F'，
显示：对，
填充：假，
边框颜色：'#ff6384'，//红色
数据：[100,96,84,76,69]
}, {
//键入：“行”，
标签：“重力”，
yAxisID:'G'，
显示：对，
填充：假，
边框颜色：'#36a2eb'，//蓝色
数据：[1.07,1.055,1.020,1.015,1.012]
}]
};
//@ts忽略
var myChart=新图表（画布{
键入：“行”，
数据：图表数据，
选项：{
标题：{
显示：对，
短信：“嗯，啤酒！”
},
比例：{
雅克斯：[{
id:'F'，
位置：'左'，
滴答声：{
fontColor:“#ff6384”，//红色
建议民：32，
建议最大值：100
}
}, {
id:'G'，
位置：'右'，
滴答声：{
fontColor:“#36a2eb”，//蓝色
建议:一,，
建议最大值：1.1
},
网格线：{
drawOnChartArea:false，//只希望显示一个轴的网格线
},
}]
}
}
});
正文{
背景：#20262E；
填充：20px；
字体系列：Helvetica；
}

@Adnan，thx用于编辑。我不知道你可以直接把可运行的代码片段放在问题中。我的荣幸！Stackoverflow的一个新特性是添加可运行的代码段。然而，我不明白你想做什么。您想更改网格线的颜色吗？@AdnanSharif我正在尝试更改左右雅克斯上刻度标签的颜色。例如，左轴上的温度值为红色，右轴上的SG值为蓝色。宾果！我很好奇：你是在什么地方找到这个记录的，还是你只是用它做实验？它是有记录的