score:4

Accepted answer

The API has a method to update the series (http://api.highcharts.com/highcharts#Series.update()). e.g.

chart.series[0].update({ type: 'spline' });

You should be able to use this API call to modify any of the series attributes.

For instance, you could have two series objects defined, and update the chart to use the one you want on a button click:

var seriesWeek = {
            type: 'column',
            name: title,
            data: data,
            dataGrouping: {
                units: [ ['week', [1] ] ]
            }
    }

var seriesMonth = {
            type: 'column',
            name: title,
            data: data,
            dataGrouping: {
                units: [ ['month', [1] ] ]
            }
    }

chart.series[0].update(seriesWeek);

score:0

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

score:1

I have always exactly one timeseries, so this approach works for me (no need to update each timeseries manually):

self.myChart = new window.Highcharts.stockChart(pChartDivContainer, {
        title: {
            text: 'My title'
        },
        rangeSelector: {
            enabled: true
        },
        plotOptions: {
            series: {

                dataGrouping: {
                    approximation: 'ohlc',
                    units: [
                        ["minute", [1]]
                    ],
                    forced: true,
                    enabled: true,
                    groupAll: true
                }

            }
        }
    }, function (chart) {
        self.onChartReady();
    });

After that it's easy to change the unit:

self.setCandleInterval = function (pUnit, pInterval) {
    self.myChart.update({
        plotOptions: {
            series: {
                dataGrouping: {
                    units: [
                        [pUnit, [pInterval]]
                    ]
                }
            }
        }
    });
}

Related Query

More Query from same tag