JavaScript Chart Examples

SciChart.js ships with ~60 JavaScript Chart Examples which you can browse, play with, view the source code and see related documentation. All of this is possible with the SciChart.js Examples Suite, which ships as part of the SciChart.js SDK

Zoom and Pan with Overview Chart

Demonstrates how to zoom and pan with an Overview Chart using SciChart.js, High Performance JavaScript Charts

This examples shows how use SciChartOverview to quickly create an overview chart that contains a draggable box that controls the visible range of another chart

Drag the box to pan the main chart, and drag the handles of the box to resize it and zoom the main chart. Right click and drag on the main chart to zoom.


The overview is a normal sciChartSurface so you can add annotations to it, or customise it any way you want.

You can easily customise which series appear in the overview, and how they are rendered, with the transformRenderableSeries option.

You can also apply the overview to vertical charts.

2D Charts
Chart Legends
SciChart Ltd, 16 Beaufort Court, Admirals Way, Docklands, London, E14 9XL.