Javascript 如何使Chart.js中的背景色与颠倒顺序的y轴匹配?

Javascript 如何使Chart.js中的背景色与颠倒顺序的y轴匹配?,javascript,chart.js,Javascript,Chart.js,我正在努力使我的背景色在Chart.js中正常工作。我已经颠倒了y轴刻度的顺序。现在我的背景色也被翻转了。它从边界线填充到图形顶部,而不是像我希望的那样从边界线填充到x轴 在这里。我的代码是: var options = { type: 'line', data: { labels: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], datasets: [ {

我正在努力使我的背景色在Chart.js中正常工作。我已经颠倒了y轴刻度的顺序。现在我的背景色也被翻转了。它从边界线填充到图形顶部,而不是像我希望的那样从边界线填充到x轴

在这里。我的代码是:

var options = {
  type: 'line',
  data: {
    labels: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
    datasets: [
        {
          label: 'Rank',
          data: [12, 19, 3, 5, 2, 3],
        borderWidth: 1,
        backgroundColor: "#8FBC8F"
        }
        ]
  },
  options: {
    scales: {
        yAxes: [{
        ticks: {
                    reverse: true
        }
      }]
    }
  }
}

var ctx = document.getElementById('chartJSContainer').getContext('2d');
new Chart(ctx, options);

我很幸运地阅读了Chart.js文档,这让我觉得这可能是不可能的。我想看看是否有其他人遇到过这个问题,他们是否找到了解决方案。谢谢你的帮助

只需尝试添加填充:“开始”

检查

var options = { type: 'line', data: { labels: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], datasets: [ { label: 'Rank', data: [12, 19, 3, 5, 2, 3], borderWidth: 1, backgroundColor: "#8FBC8F", fill: 'start' } ] }, options: { scales: { yAxes: [{ ticks: { reverse: true } }] } } } var ctx = document.getElementById('chartJSContainer').getContext('2d'); new Chart(ctx, options);