【问题标题】:Chart.js : How to fill the area under the line to a certain point?Chart.js:如何将线下区域填充到某个点?
【发布时间】:2023-12-28 20:08:01
【问题描述】:

我使用chart.js 库创建了一个折线图并填充了折线下方的区域。

我遇到的问题是线下的填充不会在图表上的最后一个绘制点处停止。当线条停止但它继续前进时,曲线下的填充应该停止。有没有办法指定填充区域,这样它就不会超过线/最后一个绘制点?

我查看了文档并找到了一个填充属性,但它并没有解决问题。我认为这可能与图表边框或网格线有关。

【问题讨论】:

  • 您的图表对象/代码是什么样的?
  • 对不起,我不允许发布代码。
  • 这是因为您拥有的数据多于标签。确保 lablesdata 数组的长度相等。
  • 那行得通。我花了几个小时弄乱边界和网格线,但事实证明这是不同的。非常感谢!
  • 您可以添加一个示例图表来演示您的场景。

标签: javascript plot graph chart.js linechart


【解决方案1】:

dataset 选项中,设置fill: '-1'

【讨论】: