Javascript 在mixed graph chart.js中，如果条形图的颜色高于平均分数，如何更改其颜色

在这个参考图片中，我想改变颜色为绿色的酒吧，如果它去以上的AvgScor是线酒吧

我使用的是chart.js混合图

在这个img中，左边第四个高于平均分数

var ctx=document.getElementById（“总分”）.getContext（“2d”）；
var totalScoreData=[60,30,50,75,45,41]；//向数组中添加数据值
var averageData=[61,45,55,70,46,52]//向数组添加数据值
变量标签=[“A”、“Q”、“C”、“C”、“A”、“p”]；//向数组添加标签
var总体得分=新图表（ctx{
类型：'bar'，
数据：{
标签：标签，
数据集：[{
标签：'分数'，//为系列命名
数据：TotalScore数据，
背景颜色：“rgba（255,99,132,0.2）”，
边框宽度：1
},
{
标签：“AvgScore”，
数据：平均数据，
背景颜色：“#f443368c”，
边框颜色：“#f443368c”，
borderWidth:1，//指定条形图边框宽度
键入：“行”，
填充：假
}]
},
选项：{
responsive:true，//指示chart js做出良好的响应。
MaintaintAspectRatio:false，
比例：{
雅克斯：[{
显示：对，
滴答声：{
贝吉纳泽罗：是的，
步骤：10，
最高：100
}
}]
}
}
});
好的，让我们先创建一个最小的可复制示例（在问题中，请确保有人可以在此处单击“运行代码片段”，或打开指向代码笔/代码沙盒的链接等的代码。-您应该提供虚拟数据，以便其他人可以立即开始使用示例，就像您在屏幕截图中看到的一样:


var ctx=document.getElementById（“总分”）.getContext（“2d”）；
var totalScoreData=[60,30,50,75,45,41]；//向数组中添加数据值
var averageData=[61,45,55,70,46,52]//向数组添加数据值
变量标签=[“A”、“Q”、“C”、“C”、“A”、“p”]；//向数组添加标签
函数colorGenerator（）{
返回totalScoreData.map（（子级，索引）=>{
如果（子项>=平均数据[索引]）{
返回“rgba（5250,10,0.2）”
}否则{
返回“rgba（255、99、132、0.2）”
}
})
} 
var总体得分=新图表（ctx{
类型：'bar'，
数据：{
标签：标签，
数据集：[{
标签：'分数'，//为系列命名
数据：TotalScore数据，
backgroundColor:colorGenerator，//使用函数设置颜色
边框宽度：1
},
{
标签：“AvgScore”，
数据：平均数据，
背景颜色：“#f443368c”，
边框颜色：“#f443368c”，
borderWidth:1，//指定条形图边框宽度
键入：“行”，
填充：假
}]
},
选项：{
responsive:true，//指示chart js做出良好的响应。
MaintaintAspectRatio:false，
比例：{
雅克斯：[{
显示：对，
滴答声：{
贝吉纳泽罗：是的，
步骤：10，
最高：100
}
}]
}
}
});
///从chart.js文档：
/*
var图表数据={
标签：[“一月”、“二月”、“三月”、“四月”、“五月”、“六月”、“七月”]，
数据集：[{
键入：“行”，
标签：“数据集1”，
边框颜色：window.chartColors.blue，
边界宽度：2，
填充：假，
数据：[
1,2,3,4,5,6,7
]
}, {
类型：'bar'，
标签：“数据集2”，
背景颜色：window.chartColors.red，
数据：[
2,3,4,5,6,7,8
],
边框颜色：“白色”，
边框宽度：2
}]
};
window.onload=函数（）{
var ctx=document.getElementById（'canvas'）.getContext（'2d'）；
window.myMixedChart=新图表（ctx{
类型：'bar'，
数据：图表数据，
选项：{
回答：是的，
标题：{
显示：对，
文本：“Chart.js组合条形折线图”
},
工具提示：{
模式：“索引”，
交集：对
}
}
});
};
*/

请以最小可复制示例的形式发布您的代码-然后我/我们可以帮助：）@Alex L好的，我正在编辑