在Chart.js行中中断一行

b4wnujal  于 2022-11-06  发布在  Chart.js
关注(0)|答案(1)|浏览(186)

我在chart.js中遇到了一个奇怪的情况,请参见图片x1c 0d1x
基本上是一个有4个日期和4个数字的数据集。所有4个数字的值都是1(无所谓)。但实际上真实的数据只需要显示2个区间(1/1/2020 -〉2/2/2020)和(3/4/2021-〉6/6/2021)。基本上没有中间的分段。
在这种情况下,Chart.js无法理解不绘制该段,在所有4个不同日期中,所有值均为1。
因此,我认为唯一的解决方案是细分所有的区间,这样我就可以在中间放置一个NaN,并使用类似stepped:true的东西来表示直线。但对于大量的数据,我基本上会将日期的数量加倍,使图形更加混乱。
所以问题是...有没有办法指定给定点是起点还是终点?或者有没有更好的方法来代替单线数据集?

  • 谢谢-谢谢
shstlldc

shstlldc1#

只需传递2个数据集:

const labels = Utils.months({count: 7});
const data = {
  labels: labels,
  datasets: [{
    label: 'My First Dataset',
    data: [65, 59, 80],
    fill: false,
    borderColor: 'rgb(75, 192, 192)',
    tension: 0.1
  },{
    label: 'My 2nd Dataset',
    data: [null, null, null, 81, 56, 55, 40],
    fill: false,
    borderColor: 'rgb(75, 40, 192)',
    tension: 0.1
  }]
};

如果您将对象而不是数组作为数据传递,则甚至不必用空值填充

相关问题