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.

JavaScript Chart Annotations

Demonstrates how to add Annotations (shapes, boxes, lines, text) to a JavaScript Chart using SciChart.js, High Performance JavaScript Charts

An introduction to the Annotations API in SciChart.js, which allows SVG elements or custom WebGL rendered elements to be placed over the chart at specific X,Y data-values.

Several annotations are available out of the box, such as LineAnnotation, BoxAnnotation, TextAnnotation, and we provide a CustomAnnotation and SVGAnnotation which allows for custom shapes to be placed over the chart.


The AnnotationBase type has properties for x,yCoordinateMode which allow you to place annotations are relative or absolute values. Great for docking annotations to the top,left,right,bottom of a chart, or creating watermarks!

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