根據範圍選擇器調整Highcharts數據分組

根據highcharts範圍選擇器的值，我想更改數據分組。在我的柱形圖中，如果選擇了一週，應該有7個欄，如果選擇了一天，則應該有24個欄，如果選擇了一個月，那麼每個月的每一天應該有一個欄。根據範圍選擇器調整Highcharts數據分組

似乎沒有任何方法可以在Highchart配置中提供一個函數來完成此操作，但我可能會遺漏一些東西。

我目前的計劃是處理範圍選擇器上的單擊事件，以更新系列數據以包含正確數量的點。但可能有更好的辦法。

感謝

2014-08-29 dezman

當然有一堆options available in highstock for data grouping。

你應該看的主要是units。在這裏您可以指定允許哪種組。

頂部帶有groupPixelWidth，你有你所需要的，這個寬度定義了圖表中一個點的點數是多少，如果圖表上的點數越多，每點的寬度越小，一旦它下降這個高門檻閾值會強制分組。保持這個大小足以強制下一個級別的分組，因爲你在屏幕上不要超過30個點。

dataGrouping: { 
    units: [ 
     ['hour', [1]], 
     ['day', [1]], 
     ['month', [1]], 
     ['year', null] 
    ], 
    groupPixelWidth: 100 
}

@jsFiddle

來源

2014-08-29 18:47:37

我們試圖解決這個黑客攻擊，在這裏我們使用Highstock的（Splinechart）RangeSelector，事件和DataGrouping。點擊每週rangeselectorButton，我們通過setExtremes捕獲此事件。發佈事件後將其近似爲「總和」。如果您使用兩個序列而不是迭代對象。

events: { 
     setExtremes: function (e) { 
      if (e.rangeSelectorButton != undefined) { 
       var triger = e.rangeSelectorButton; 
       if (triger.type == 'week') { 
        $.each(this.series, function (index, obj) { 
         obj.options.dataGrouping.units[0] = ['week', [1]]; 
        }); 
       } else if (triger.type == 'day') { 
        $.each(this.series, function (index, obj) { 
         obj.options.dataGrouping.units[0] = ['day', [1]]; 
        }); 
       } 
      } 
     } 
    },

@fiddle

來源

2015-04-10 07:57:52 imsinu9

根據範圍選擇器調整Highcharts數據分組

回答

相關問題