DevExtreme v23.1 is now available.

Explore our newest features/capabilities and share your thoughts with us.

Your search did not match any results.
Bar Charts

Custom Annotations

Annotations are designed to show additional information about visualized data. You can display images, text blocks, and custom content in annotations. To create custom annotations, specify the following Chart properties.


The annotations array specifies a collection of annotations. This demo uses a data source array to create this collection. Each object has the argument property and a data object. The argument property positions an annotation at a specific argument, and the data object stores data from a data source.

You can use the annotations array to configure each annotation individually.


Use the commonAnnotationSettings object to specify settings common to all annotations in the chart. In this object, assign custom to the type property. To anchor annotations to a series point, specify the series property. Finally, declare the SVG markup in the annotation template.

Note that individual annotation settings override the common annotation settings.


You can also implement the customizeAnnotation function to customize an individual chart annotation.

Thank you for your interest in our ASP.NET MVC product libraries and UI component suite. We are moving ASP.NET MVC-related demos and content to Please make sure to update your bookmarks with our new URL.

View Demo