Chart.js v2格式化时间标签

Question

我有一些图表，用户可以在其中输入不同的时间跨度范围，以便在图中获得所需的结果集。根据图形的范围，时间的格式应该不同。举个例子，看一个10分钟长的图，你可能会看到一些格式为HH:MM的时间线，但这对一个月长的图来说没有意义，因为格式为MM/dd更有意义。

返回数据集时，我有开始时间戳(unix ts)和结束时间戳(也是unix ts)。

Chart.js是否有工具可以通过转换我上面的时间戳来帮助做出格式化时间标签的明智决定？我是否需要编写一个带有自定义算法的回调，手动确定图形和标签的时间戳？

如果需要一个看起来像的手动算法，那么需要一些代码来覆盖很多用例

if (timespan > 86400 * 30)      
{
// create format code for month 
}
else if (timespan > 86400 * 5)
{
// weekly format
}
else if ( ... ) {}

使用Chart.js有更好的方法吗？

Answer 1

来自Chart.js时间轴文档：

构建刻度时，它将根据刻度的大小自动计算最舒适的单位。

这似乎工作得很好，如下面的两个图表所示，第一个图表的范围为10分钟，第二个图表的时间范围为10天：

let now = (new Date()).getTime(),
minutes = [],
days = [],
options = {
scales: {
xAxes: [{
type: 'time'
}]
}
};
for (let i = 0; i < 10; i++) {
minutes.push({
x: now + (60000 * i),
y: 10
});
days.push({
x: now + (86400000 * i),
y: 10
});
}
new Chart(document.getElementById('canvas1'), {
type: 'line',
data: {
datasets: [{
data: minutes
}]
},
options: options
});
new Chart(document.getElementById('canvas2'), {
type: 'line',
data: {
datasets: [{
data: days
}]
},
options: options
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.bundle.min.js"></script>
<canvas id="canvas1"></canvas>
<canvas id="canvas2"></canvas>

您可以传入各种单位(分钟、天、月等)的显示格式，以自动获得所需的缩放比例和格式。