Scrollbars

There are two major approaches to scrollbars in Highcharts.

  1. Native scrollbars for mobile

These scrollbars are applied by setting a scrollablePlotArea with a minWidth. When the width of the plot area becomes less than this, it is applied to a separate div in the page, where native, smooth scrolling is applied, while the axes, titles, legend and other elements stay fixed. This provides a great way to support long data series in a narrow mobile view. See the effect below in a mobile browser or just a small desktop browser window.

  1. Axis scrollbars through an API option

These scrollbars are enabled per axis and appear next to the axis. Scrollbars can be applied to any axis in Highcharts Stock.

The full documentation and available options can be seen in our API docs for Highcharts Stock.

Scrollbars are not limited to stock charts or Y axis. Using the highstock.js file, it can be applied to regular Highcharts axes too. See examples of:

Edit this page