How can I group different series by different units using rangeSelector?

0
votes

So my problem is I have 3 series each with 30min interval data.

  1. The data series:

    • should be grouped by units defined in the rangeSelector text ( this is working fine )

  2. The Average serie:

    • should be grouped by a unit greater then the data series ( like data grouped by day the average should show the week average, data grouped by week the average should be the month average )

  3. The Peak series:

    • should be grouped by a unit greater then the data series ( like data grouped by day the peak should show the week peak, data grouped by week the peak should be the month peak )

The average and peak series don't need to have value every 30min if it helps solving the problem. but it should be a strait line for the period so I cannot have one point for each grouping.

this is an example of what I have now (http://jsfiddle.net/tc97kud0/11/)

rangeSelector: { buttons: [ { type: "day", count: 1, text: "Day" }, { type: "week", count: 1, text: "Week", dataGrouping: { forced: true, units: [ [ "day", [ 1 ] ] ] } }, { type: "month", count: 1, text: "Month ( group by day )", dataGrouping: { forced: true, units: [ [ "day", [ 1 ] ] ] } }, { type: "month", count: 1, text: "Month ( group by week )", dataGrouping: { forced: true, units: [ [ "week", [ 1 ] ] ] } }, { type: "year", count: 1, text: "Year", dataGrouping: { forced: true, units: [ [ "month", [ 1 ] ] ] } }, { type: "all", text: "All" } ], selected: 5, buttonTheme: { width: null } },
series: [{ name: 'ADBE', data: ADBE, tooltip: { valueDecimals: 2 }, dataGrouping: { approximation: "average" } }, { name: 'Data point count (confidence)', data: ADBE, type: 'column', dataGrouping: { approximation: "SUM" } }]

So is there any way I can change grouping by rangeSelector and have different units for grouping to each series?

I know that I can have different approximation for each series setting it in the serie dataGrouping property.

But the units are based on rangeSelector options, so I cannot or don't know how to set the units in the serie to be used accordingly to the rangeSelector option active at the moment.

1
highchartshighstock

1 Answers

4
votes

You can use click events of range selector buttons to set individual data grouping for every series:

       {
          type: "month",
          count: 1,
          text: "Month ( group by day )",
          events: {
            click: function() {
                chart.series[0].update({
                  dataGrouping: {
                        forced: true,
                        units: [ [ "day", [ 1 ] ] ]
                      }
              }, false);

              chart.series[1].update({
                  dataGrouping: {
                        forced: true,
                        units: [ [ "month", [1] ] ]
                      }     
              }, false);

            }
          }
        }

Live demo: http://jsfiddle.net/BlackLabel/xfyuawmu/