Chartjs - How to get last 7 days on x-axis labels?(Chartjs - 如何在 x 轴标签上获取最后 7 天?)
问题描述
我试图在我的折线图的 x 轴上获取最后 7 天(使用 chartjs).最好的方法是什么?
I am trying to get the last seven days on the x-axis of my line-chart (using chartjs). What is the best way to do this?
谢谢
推荐答案
您可以使用以下代码实例化过去 7 天的图表:
You can instantiate a chart for the last seven days with the following code:
let start = new Date(),
end = new Date();
start.setDate(start.getDate() - 7); // set to 'now' minus 7 days.
start.setHours(0, 0, 0, 0); // set to midnight.
new Chart(document.getElementById("chart"), {
type: "line",
options: {
scales: {
xAxes: [{
type: "time",
time: {
min: start,
max: end,
unit: "day"
}
}]
}
}
});
<script src="aHR0cHM6Ly9jZG5qcy5jbG91ZGZsYXJlLmNvbS9hamF4L2xpYnMvQ2hhcnQuanMvMi44LjAvQ2hhcnQuYnVuZGxlLm1pbi5qcw=="></script>
<canvas id="chart"></canvas>
日期算术之所以有效是因为 日期对象在设置月份的值无效时自动更正.
The date arithmetic works because of the Date object auto correcting itself when the value is invalid for the set month.
您需要将值提供为 x
(或 t
)&y
属性,指定在文档中.
You'll need to provide your values as x
(or t
) & y
properties, as specified in the documentation.
这篇关于Chartjs - 如何在 x 轴标签上获取最后 7 天?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:Chartjs - 如何在 x 轴标签上获取最后 7 天?


- 我不能使用 json 使用 react 向我的 web api 发出 Post 请求 2022-01-01
- 为什么我的页面无法在 Github 上加载? 2022-01-01
- 如何显示带有换行符的文本标签? 2022-01-01
- 在不使用循环的情况下查找数字数组中的一项 2022-01-01
- 为什么悬停在委托事件处理程序中不起作用? 2022-01-01
- 如何向 ipc 渲染器发送添加回调 2022-01-01
- 是否可以将标志传递给 Gulp 以使其以不同的方式 2022-01-01
- 使用 iframe URL 的 jQuery UI 对话框 2022-01-01
- 如何调试 CSS/Javascript 悬停问题 2022-01-01
- 从原点悬停时触发 translateY() 2022-01-01