在高于/低于任意值时，如何更改Chart.js线的颜色？

请注意，当蓝线下降到任意值以下时，它是如何变为红色的

另外，此屏幕截图是Chart.js图表，但我无法访问源代码。

提供了一系列可用于执行自定义代码的挂钩。您可以使用afterLayout钩子来创建一个指定的阈值。然后必须将其分配给

数据集的
borderColor
属性

请看一下下面的可运行代码，看看它是如何工作的


const阈值=25；
新图表（“myChart”{
键入：“行”，
插件：[{
后布局：图表=>{
设ctx=chart.chart.ctx；
ctx.save（）；
设yAxis=图表刻度[“y轴-0”]；
设yThreshold=yAxis.getPixelForValue（阈值）；
让gradient=ctx.createLinearGradient（0，yAxis.top，0，yAxis.bottom）；
渐变。添加颜色停止（0，'绿色'）；
设偏移量=1/yAxis.bottom*yThreshold；
渐变。添加颜色停止（偏移，“绿色”）；
渐变。添加颜色停止（偏移，“红色”）；
渐变。添加颜色停止（1，'红色'）；
chart.data.datasets[0]。borderColor=gradient；
ctx.restore（）；
}
}],
数据：{
标签：['A'，'B'，'C'，'D'，'E'，'F'，'G']，
数据集：[{
标签：“我的数据集”，
数据：[32,44,29,33,18,15,30]，
填充：假
}]
},
选项：{
图例：{
显示：假
}
}
});

我记得有一个插件专门针对这种情况。我记不起也找不到名字了…想想看，凯文。。。想想看！这真是个好东西，谢谢你！（很抱歉，我花了一些时间来测试它）。