Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

HighStock chart.rangeSelector after loading

Tags:

highcharts

I know how to set the default range selector when defining a new chart by using

rangeSelector: {
    selected:0,
},

Is it possible to change this after new data has been loaded though javascript?

eg:

chart.series[0].setData(new data);
somethinghere rangeselector selected = 2;

I can set it using the range extreme, but this doesn't highlight the button to show the user what date range is selected and it would ( I think) make for a cleaner way of setting the date.

like image 761
sbozzie Avatar asked Feb 18 '23 17:02

sbozzie


2 Answers

It is possible by catching button event and add state.

http://jsfiddle.net/jGALb/

 chart.rangeSelector.buttons[4].setState(2);
 chart.rangeSelector.clickButton(4,4,true);
like image 55
Sebastian Bochan Avatar answered Mar 05 '23 02:03

Sebastian Bochan


I had some issues with this answer. Looking at the source for the latest stable version of Highstock, here's the argument documentation for the clickButton signature,

@param {Number} i The index of the button
@param {Object} rangeOptions
@param {Boolean} redraw

My example here is for a custom button to display the last 12 hours.

var rangeOptions = {
    type: "hour",
    count: 12
};

chart.rangeSelector.clickButton(2,rangeOptions,true);

Notice, I didn't need to set the button state either.

like image 40
dthartman Avatar answered Mar 05 '23 03:03

dthartman