ChartJS在第一个数据点和最后一个数据点之间得到一条不需要的线

Question

我在第一个数据设定点和最后一个数据设定点之间得到了额外的不需要的线。 （请查看图片）

我已经仔细检查了我的数据源，它们都具有相同的大小，并且没有NaN或Null值。任何帮助都非常感谢。

背景：ChartJS + AngularCLI

以下是配置

this.chart = new Chart('canvas', {
      type: 'line',
      data: {
        labels: dates,
        datasets: [
          {
            data: total,
            borderColor: '#743cba',
            fill: false,
            label : 'Total Cases'
          },
          {
            data: passed,
            borderColor: '#3cba9f',
            fill: false,
            label : 'Passed'
          },
          {
            data: fail,
            borderColor: '#ba3c3c',
            fill: false,
            label: 'Failed'
          },
          {
            data: lsf_fail,
            borderColor: '#00cbff',
            fill: false,
            label: 'LSF (Failure)'
          }/*,
          {
            data: improved,
            borderColor: '#3cb5ba',
            fill: false,
            label: 'Improved'
          },
          {
            data: unfinished,
            borderColor: '#e9fc16',
            fill: false,
            label: 'Unfinished'
          }*/
        ]
      },
      options: {
        elements: {
          line: {
            tension: 0,
          }
        },
        scales: {
          yAxes: [{ display: true }],
          xAxes: [{
            type: 'time',
            autoSkip: true,
            time: {
              unit: 'week',
              stepSize: 1
            },
            display: true
          }]
        },
        title: {
          display: true,
          text: 'SDOC LSF Metrics',
        }
      }
    });

Answer 1

我遇到了同样的问题，请按照从最早到最新的顺序对您的数据进行排序，它将解决该问题。