Highstock scroll bar-Single scroll bar for 4 charts

Question

Highstock scrollbar

I have used the Highstock-2.1.8.zip_FILES/examples/ styled scroll bar. I am in need to get a single scroll-bar which is fixed for 4 charts (time axis charts). How can i do it?

Answer 1

You can add four timeseries as stacked series. see the fiddle I have created Here I have three series in it ,you can add further series to it. Add three/more yAxis and position them as below code:

          yAxis: [
                      {
                        opposite : false,
                        min: 0,                    
                         labels: {
                                align: 'left',
                                x: -5
                            },
                        title: {
                            text: 'Critical',style : {
                                fontSize : '9px'
                            }
                        },
                        top: 0,
                        height: '31%',
                        offset: 0,
                        lineWidth: 2
                    },{
                        opposite : false,
                        min: 0,
                        //max: 100,
                        labels: {
                            align: 'left',
                            x: -5
                        },
                        title: {
                            text: 'Major',style : {
                            fontSize : '9px'
                        }
                        },
                        top: '30%',
                        height: '30%',
                        offset: 0,
                        lineWidth: 2
                    },{
                        opposite : false,
                        min: 0,
                        //max:10,
                        labels: {
                            align: 'left',
                            x: -5
                        },
                        title: {
                            text: 'Minor',style : {
                                fontSize : '9px'
                        }
                        },
                        top: '70%',
                        height: '30%',
                        offset: 0,
                        lineWidth: 2
                    }
                ] 

Add 3 series corresponding to three yAxis. refer example shred on fiddle link