Data grouping into weekly,monthly by user

Question

I have a highstock line chart displaying daily and weekly stock prices for a given stock. Problem is when the data array is large enough the daily data points get "sampled" into weekly data points and weekly data points get sampled down to monthly data points.

Is there any way to set them by user to weekly,or monthly when needed.

Thanks in advance

Answer 1

You can change the dataGrouping.units at any time through each series' update() method:

//http://api.highcharts.com/highstock#plotOptions.series.dataGrouping.units
var unit = 'week'; //'day' 'month'

//http://api.highcharts.com/highstock#Series.update
_chart.series.forEach(function(ser) {
    ser.update({
        dataGrouping: {
            units: [ [unit, [1]] ]
        }
    }, false);
});

_chart.redraw();

Example: http://jsfiddle.net/X5WbN/20/

Answer 2

We tried a Hack around this, where we used Highstock's (Splinechart) RangeSelector, Event and DataGrouping. On click of weekly rangeselectorButton we catch this event through setExtremes. Post catching the event approximate it to "sum". If you are using two series than iterate the object.

  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

Answer 3

Check about dataGrouping.
You can set it to get sampled when needed like the example.
Or if you want to disable you can set it to false, like the code bellow or here:

series: [{
    type: 'candlestick',
    name: 'AAPL',
    data: arrayOfData,
    dataGrouping: {
        enabled: false
    }
}]