Highcharts / Highstock scroll default position - highcharts

Question

I have a HighStock charge with a scrollbar very similar to this one
http://jsfiddle.net/gh/get/jquery/3.1.1/highslide-software/highcharts.com/tree/master/samples/stock/demo/navigator-disabled/
Highcharts.stockChart('container', {
rangeSelector: {
selected: 1
},
title: {
text: 'AAPL Stock Price'
},
navigator: {
enabled: false
},
series: [{
name: 'AAPL Stock Price',
data: data,
tooltip: {
valueDecimals: 2
}
}]
});
I want the default scroll position to be somewhere in the middle of the chart though, is there any way to do this?

Answer 1

You can do this with xAxis.setExtremes on the chart.events.load call. A simple example (using arbitrary 1 year range):
chart: {
events: {
load: function() {
this.xAxis[0].setExtremes(
Date.UTC(2013, 0, 1),
Date.UTC(2013, 11, 31)
);
}
}
},
Example jsFiddle.
If you need to determine what your "middle" is it can depend on your data source where you could pre-calculate it or you could do it also on the chart.events.load call.
For fun I added the mid-point calculations. This uses moment.js because it is much easier than rolling your own time methods.
minX = data[0][0];
maxX = data[data.length - 1][0];
midX = minX + ((maxX - minX) / 2);
var midDate = new Date(midX);
var startDate = moment(midDate);
var endDateMoment = moment(midDate);
startDate.subtract(1.5, 'months');
endDateMoment.add(1.5, 'months');
Note that I am addinng/subtracting 1.5 months to make your 3 month range selector valid. The moment.js library rounds those up to 2 months. You get the idea though. So your setExtremes becomes:
this.xAxis[0].setExtremes(
startDate.valueOf(), //.valueOf() in this context converts to javascript time
endDateMoment.valueOf()
);
And here is live jsFiddle.