Chartjs 基于最小值和最大值的渐变背景颜色

Question

我使用 Chartjs 和 vue-chart 在我的应用程序中显示一些数据，实际上我想要实现的是拥有一个背景颜色从红色到绿色的条形图。该图表具有动态最小值和最大值，但不能小于 0 且大于 5。类似于 5 星评级。为了显示所显示数据的差异，我没有将图表的最小值/最大值从 0 固定到 5。目前这是显示我的图表的代码：选项：min 为最小值-0.2但不小于0；max比最大值+0.2但不大于5；return {  legend: {    display: false  },  scales: {    yAxes: [      {        ticks: {          beginAtZero: true,          min,          max,          stepSize: 0.5        }      }    ]  }}条形图数据：  return {    labels: this.labels,    datasets: [      {        label: 'Evaluation',        data: [          this.photo.composition,          this.photo.technique,          this.photo.creativity,          this.photo.content,          this.photo.lighting        ],        borderWidth: 1      }    ]  }渲染图：  const gradient = this.$refs.canvas    .getContext('2d')    .createLinearGradient(0, 300, 0, 0)  gradient.addColorStop(0, '#FF5722')  gradient.addColorStop(0.5, '#FFC107')  gradient.addColorStop(1, '#8BC34A')  this.data.datasets[0].backgroundColor = gradient  this.renderChart(this.data, this.options)结果非常接近我正在寻找的结果：不幸的是，我希望看到的是 0 上的红色和 5 上的绿色，因此如果最大值为 2.5（这里我期望橙色），则渐变不应达到绿色，对于较低的值也是如此......我希望它合理。有人能指出我正确的方向吗？谢谢！