How to: Create an Image Annotation Anchored to a Chart or Pane
- 2 minutes to read
This example demonstrates how to create two image annotations - one anchored to a chart (by specifying two absolute pixel coordinates), and another one - to a pane (by specifying two axis values). For general information, refer to Annotations.
A complete sample project is available in the DevExpress Code Examples database at https://supportcenter.devexpress.com/ticket/details/e2188/how-to-accompany-a-chart-its-pane-or-series-point-by-text-or-image-annotations.
To demonstrate how this can be done, we’ll use a chart similar to the one created in the following tutorial: Lesson 1 - Create a Simple Unbound Chart.
Anchor an Annotation to a Chart
Click the chart’s smart tag, and in its actions list, click Annotations… link.
In the invoked Annotation Collection Editor, click Add, and then double-click the Image Annotation type.
For the created annotation, click the ellipsis button for its Annotation.AnchorPoint property.
Then, choose the Chart Anchor Point type.
And, define the X and Y coordinates (in pixels) for the annotation’s anchor point. Note that these coordinates are absolute, and will not be changed when the chart is resized.
Anchor an Annotation to a Pane
Now, create another image annotation, and via its Annotation.AnchorPoint property, specify the Pane Anchor Point type.
Note that the pane anchor point sticks to the specified axes’ coordinates when the chart is being resized, or scrolled and zoomed.