ChartJS xAxis时间格式不会在几天内发生变化

我有一个ChartJS图表，可及时显示数据。ChartJS xAxis时间格式不会在几天内发生变化

我使用以下时间格式：

displayFormats: { 
    millisecond: 'mm:ss', 
    second: 'mm:ss', 
    minute: 'HH:mm', 
    hour: 'HH:mm', 
    day: 'MMM DD', 
    week: 'MMM DD', 
    month: 'YYYY MMM', 
    quarter: 'YYYY MMM', 
    year: 'YYYY', 
}

我让用户从多个选项中进行选择：

最后一小时
最后一天
上周
最后月

在做'最后一小时'时，输出效果很好。使用minute

在做Last Day，输出还是不错的。使用hour

在做Last Week时，输出非常差。我甚至尝试9天，但它再次使用hour

，并显示出它不是在小时“卡住”，做了一个月的时候，输出是不错的。使用day。

现在，虽然我明白为什么它是（就是了标签的量，所以它关系到小时有多个标签比天），我不知道如何解决它。

我希望本周能显示day格式。有什么办法可以通过ChartJS实现？

我不确定这会有帮助，但是我为每个屏幕显示的数据点数量不尽相同，并且可能是5,000 - 50,000，并且也未提前知道。

红利令人厌烦的是，在右侧，由于创建的步骤数量多，它有时会在标签顶部创建标签。有没有办法解决这个问题？

来源

2017-08-07 Amit

你可以设置这表明该样品小提琴？要特别了解您的图表配置和输入数据。 –

可以使用unit属性强制您希望xAxis使用的单位。例如，如果你想它来显示它在几天而不是几个小时，你可以用一个类似配置方面：

var chart = new Chart(ctx, { 
    type: 'line', 
    data: data, 
    options: { 
     scales: { 
      xAxes: [{ 
       time: { 
        unit: 'day', 
        displayFormats: { 
         day: 'MMM DD' 
        } 
       } 
      }] 
     } 
    } 
});

另一种方法是使用minUnit，而不是unit。这将确保您的图形更好地扩大，因为它会限制使用的最低显示格式，并且在需要时仍然灵活地使用更大的格式。

关于您的重叠标签问题，调整unitStepSize属性可能会有所帮助。在ChartJS文档的Time Units Section

更多信息

来源

2017-08-15 20:21:07

这太好了。它不会实时改变，所以我不能只为它切换设备，但如果我事先确定它就可以工作。因此，这解决了这个问题，现在我只是想知道如何重新加载图表选项，而无需重新加载整个图表。 – Amit

ChartJS xAxis时间格式不会在几天内发生变化

回答

相关问题