为什么我的线图在chartjs中向后退?

时间:2019-06-08 23:14:46

标签: javascript chart.js linechart

我正在尝试用图形表示帖子上以及发布时的数字。由于某些原因,如果分数接近,那就太疯狂了。有什么想法吗?

我一直在使用步长以及x轴的动态拉伸,但无济于事。

var myLine2 = new Chart(ctx2, {
  type: 'line',
  data: {
    //labels: '{{ labels | tojson }}',
    datasets: [{
      label: 'My Line',
      data: data,
      lineTension: 0
    }]
  },
  options: {
    //spanGaps: true,
    scales: {
      xAxes: [{
        type: 'time',
        time: {
          //unit: 'day',
          tooltipFormat: 'lll',
        }
      }]
    }
  }
});

这是它的样子: https://ibb.co/Fgq6M8M (我没有足够的声誉上传图片)

我希望该线连接到最接近右侧的点,但实际上它在图表周围飞镖移动。有什么想法吗?

我的数据集可以在这里找到:https://hastebin.com/wukeburiga.css

1 个答案:

答案 0 :(得分:0)

Chart.js按照指定的顺序绘制数据点。单个数据点的图形并不独立于其他数据点。而是按照数据集中指定的顺序从点到点绘制一条线。

从您提供的数据集中摘录显示,x轴未按升序排列。

44: {x: Wed May 22 2019 06:50:37 GMT+1000 (Australian Eastern Standard Time), y: "58"}
45: {x: Sun Jun 09 2019 15:43:57 GMT+1000 (Australian Eastern Standard Time), y: "48"}
46: {x: Sun Jun 09 2019 16:44:17 GMT+1000 (Australian Eastern Standard Time), y: "80"}
47: {x: Wed May 22 2019 09:20:12 GMT+1000 (Australian Eastern Standard Time), y: "59"}
48: {x: Mon Jun 10 2019 06:12:26 GMT+1000 (Australian Eastern Standard Time), y: "9"}

要解决此问题,请确保在将数据点传递到Chart.js之前对其进行排序。