JavaScript Chart Examples

SciChart.js ships with over 80 JavaScript Chart demos which you can browse, view the source code and see related documentation. Build incredible complex dashboards with SciChart.js, our High Performance JavaScript Chart Library.

Zoom and Pan with multiple Chart Modifiers

Demonstrates different Zoom and Pan Modifiers on a JavaScript Chart using SciChart.js, High Performance JavaScript Charts

Scroll Middle Mouse button to zoom in/zoom out. Use Right Mouse Button to select an area on the chart with RubberBandXyZoomModifier. Try it out on touch devices: use pinch zoom gesture to scale.


Use 'executeOn' property to assign a Modifier to specific mouse button.

Use 'easingFunction' property to animate zoom.

Use CSS 'touch-action' property to override browser default touch behavior. e.g., 'touch-action: none'.

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