[Expand]General Information
[Collapse]WinForms Controls
  .NET Core Support
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications, and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Expand]Data Grid
  [Expand]Vertical Grid
  [Expand]Property Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gantt Control
  [Collapse]Chart Control
   [Expand]Getting Started
   [Expand]Charting Basics
   [Expand]Series Views
   [Collapse]Chart Elements
     Chart Titles
      Annotations Position and Layout
      Annotations Appearance
   [Expand]Providing Data
   [Expand]Data Representation
   [Expand]Appearance Customization
   [Expand]End-User Features
   [Expand]Design-Time Features
   [Expand]Visual Elements
   [Expand]Additional Resources
  [Expand]Map Control
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Sunburst Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Annotations Position and Layout

This document describes how you can position annotations, and provide the runtime capability to change their layout for your end-users.

Expanded Relative and Absolute Position

The position of an annotation is specified via its Annotation.ShapePosition property, and it can be of two types.

The position type

The example image


Free Position

If the Annotation.ShapePosition property is set to the FreePosition type, you can specify whether the anchor point is targeted to the chart or a pane (FreePosition.DockTarget), and choose the corner where the annotation is docked (FreePosition.DockCorner).

In addition, you can specify the indents from the annotation and its dock target element (chart or pane), via the FreePosition.InnerIndents and FreePosition.OuterIndents properties, whose values are summarized.

Relative Position

If the Annotation.ShapePosition property is set to the RelativePosition type, you can specify the annotation's angle at its anchor point (RelativePosition.Angle), and the length of its connecting line (RelativePosition.ConnectorLength).

Expanded Annotation Layout

By default, annotations that reside within the diagram and don't fit in its dimensions are cut off. You can make an annotation behave similarly to Series Labels, so that it shrinks the diagram, to completely fit, via the Annotation.LabelMode property.

The property value The resulting image
Annotation.LabelMode = false
Annotation.LabelMode = true

To learn about the limitations imposed by using the label mode, refer to the Annotation.LabelMode property's description.

In addition, you can customize the size of the annotation (ImageAnnotation.SizeMode and TextAnnotation.AutoSize), and the angle by which the annotation's shape (where the annotation's image or text is displayed) is rotated (Annotation.Angle).

When multiple annotations are displayed, you can control their Z-order, via the Annotation.ZOrder property.

Expanded Annotation Interactivity

At design time, you can manually set the position and size of an annotation by holding down CTRL and dragging the handles on the annotation's edges.

You can enable similar runtime positioning for an annotation, via its Annotation.RuntimeAnchoring, Annotation.RuntimeMoving, Annotation.RuntimeResizing and Annotation.RuntimeRotation properties. When these options are enabled, an annotation displays the corresponding handles, so that it can be manipulated in the corresponding way.

Expanded See Also

Is this topic helpful?​​​​​​​