我正在尝试在帖子和发布时间上绘制类似数字的图表。出于某种原因,如果点很接近,它就会变得疯狂。有什么想法吗?
我一直在研究步长和 x 轴的动态拉伸(stretch),但无济于事。
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
最佳答案
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 之前已排序。
关于javascript - 为什么我的折线图在 chartjs 中倒退?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56510793/