根据范围选择器调整Highcharts数据分组

dez*_*man 3 javascript highcharts highstock

根据highcharts范围选择器的值,我想更改数据分组.在我的柱形图中,如果选择了一周,则应该有7个柱,如果选择了一天,则应该有24个柱,如果选择了一个月,则该月的每一天应该有一个柱.

似乎没有任何方法可以在高图配置中提供功能来实现这一目标,但我可能会遗漏一些东西.

我目前的计划是处理范围选择器上的单击事件以更新系列数据以包含正确的点数.但可能有更好的方法.

谢谢

Jug*_*kar 5

当然,有很多选项可用于数据分组.

你应该看的主要是units.您可以在此处指定允许的组类型.

最重要的是groupPixelWidth你得到了你需要的东西,这个宽度定义了你的图表中一个点有多小,如果图表上的点数越高,每点的宽度就越小,一旦它低于这个阈值,highcharts会强制分组.保持这么大,足以强制下一级别的分组,因为你想在屏幕上不超过30点.

dataGrouping: {
    units: [
        ['hour', [1]],
        ['day', [1]],
        ['month', [1]],
        ['year', null]
    ],
    groupPixelWidth: 100
}
Run Code Online (Sandbox Code Playgroud)

@jsFiddle