[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Collapse]WPF Controls
 [Expand]What's Installed
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Collapse]Charts Suite
   [Collapse]Chart Control
    [Expand]Getting Started
    [Expand]Providing Data
    [Collapse]Chart Elements
       Primary and Secondary Axes
       Axis Scale Types
       Whole and Visual Ranges
       Axis Layout and Appearance
       Axis Labels
       Axis Titles
       Constant Lines
       Scale Breaks
       Tickmarks, Grid Lines, and Interlacing
      Chart Titles
    [Expand]Appearance Customization
    [Expand]End-User Features
    [Expand]Design-Time Features
    [Expand]Additional Resources
   [Expand]Chart3D Control
  [Expand]Pivot Grid
  [Expand]Rich Text Editor
  [Expand]Tree List
  [Expand]Gauge Controls
  [Expand]Map Control
  [Expand]Layout Management
  [Expand]Windows Modern UI
  [Expand]Data Editors
  [Expand]Navigation Controls
  [Expand]Spell Checker
  [Expand]Property Grid
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Diagram Control
  [Expand]Windows and Utility Controls
   Dialogs, Notifications and Panels
  [Expand]Scheduler (legacy)
 [Expand]Scaffolding Wizard
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Axis Labels

The Chart control provides two types of axis labels: default, generated automatically based on an axis scale type, and custom. The following image demonstrates the default axis labels:

This document consists of the following sections:

Expanded How to Configure Custom Labels

You can create custom axis labels when default labels do not meet your requirements. The following image shows custom axis labels for a y-axis:

Use the markup below to configure custom axis labels:

The code above uses the following classes and properties:

Class or PropertyDescription
Axis2D.CustomLabels The custom axis labels' collection. If this collection is empty, a Chart control displays default axis labels.
CustomAxisLabel An individual custom axis label.
CustomAxisLabel.Value An axis value that specifies a custom label's position.
CustomAxisLabel.Content A custom label's content.
Axis2D.LabelVisibilityMode Specifies whether to show custom and default axis labels together.

Expanded How to Apply an Axis Label Text Pattern

You can set a pattern that defines a label text's format using special placeholders and plain text. In the following image, the "{V} min" pattern is applied to the y-axis labels:

The following markup shows how to configure the label text pattern:

The code above uses the following classes and properties:

Class or PropertyDescription
AxisLabel.TextPattern Specifies a text pattern.
AxisBase.Label Stores the label settings.
AxisLabel The storage of axis label settings.

The following table lists all the available placeholders:

Pattern Description
{A} Displays series point arguments (only for arguments axes).
{V} Displays series point values (only for values axes).
{VP} Displays series point values as a percentage (only for values axes).

Expanded How to Resolve Axis Label Overlapping

There are situations when axis labels do not have enough space to display all information, for example, axis arguments. The Chart control provides an algorithm which prevents axis labels from overlapping as a result of resizing. All the necessary options (axis labels rotating, staggering and hiding while resizing a chart) are enabled by default.

The axis labels overlap each other when the Resolve Overlapping options are disabled.

You can rotate, stagger and hide labels to prevent labels from overlapping when the chart is being resized.

The following XAML demonstrates how to modify axis labels to avoid overlapping:

The code above uses the following class and properties:

Class or Property Description
AxisLabelResolveOverlappingOptions Settings that allow you to modify axis label positions to avoid overlapping.
Axis2D.ResolveOverlappingOptions Gets or sets the settings that allow you to avoid labels overlapping.
AxisLabelResolveOverlappingOptions.AllowHide Gets or sets a value indicating whether to hide axis labels when resolving any overlap.
AxisLabelResolveOverlappingOptions.AllowRotate Gets or sets a value indicating whether to rotate axis labels when resolving overlapping labels.
AxisLabelResolveOverlappingOptions.AllowStagger Gets or sets a value indicating whether to stagger axis labels when resolving overlapping labels.
AxisLabelResolveOverlappingOptions.MinIndent Gets or sets the minimum indent between adjacent axis labels, when an overlap resolution algorithm is applied to them.
Show Me

A complete sample project is available in the DevExpress Code Examples database at http://www.devexpress.com/example=T316624.

Expanded See Also

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