[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
  [Collapse]Chart Control
   [Expand]Getting Started
   [Expand]Charting Basics
   [Expand]Series Views
   [Expand]Chart Elements
   [Expand]Providing Data
   [Expand]Data Representation
   [Expand]Appearance Customization
   [Expand]End-User Features
   [Expand]Design-Time Features
   [Expand]Visual Elements
    [Collapse]Creating Charts
     [Expand]Providing Data
     [Collapse]Data Representation
       How to: Change the Display Format for Series Labels of a Pie Chart
       How to: Change the Display Format for Axis Labels
       How to: Change the Display Format for Axis Labels (Runtime Sample)
       How to: Show Currency Values in the Legend of a Pie Chart
       How to: Filter Data
       How to: Show N Top Points as a Single Section in a Pie Chart
       How to: Use Automatic Date-Time Scale Modes of an Axis
       How to: Obtain Values Calculated for Automatic Axis Date-Time Scale Modes
       How to: Create a Custom Summary Function
       How to: Exclude Weekends and Holidays from the Axis Scale
       How to: Specify the Appearance of the Pie Chart Using Its Pattern at Runtime
       How to: Display Qualitative Scale Values Sorted in a Custom Sort Order
       How to: Use Custom Measure Units in an Automatic Date-Time Scale Mode
       How to: Use Custom Measure Units in an Automatic Numeric Scale Mode
     [Expand]Appearance Customization
     [Expand]Series Views
    [Expand]Chart Elements
    [Expand]End-User Interaction
    [Expand]Producing Output
   [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)

How to: Change the Display Format for Axis Labels

The following tutorial demonstrates how to customize the display format of the date-time values for the X-Axis Labels at design time. To learn more about using different scale types in XtraCharts, refer to the Axis Scale Types.

In this example, we use a simple unbound chart with a set of manually entered points for its series. These points' values are shown in the following image.


The approach described below can also be applied to a data-bound chart.

To change the display format of the date-time values for the X-axis labels, do the following.

  1. Select the axis of arguments (X-axis), and in the Properties window, set the DateTimeScaleOptions.MeasureUnit property to Month.

    As you can see, the appearance of X-axis labels have not changed.

    This happens because grid lines spacing is calculated automatically by default (the ScaleGridOptionsBase.AutoGrid is set to true), and the grid calculation algorithm does not change the DateTimeScaleOptions.GridAlignment property value (the Quarter measure unit value) for our data.

  2. To change X-axis label appearance, set the DateTimeScaleOptions.GridAlignment property to Month.

    This resets the grid automatic calculation (the ScaleGridOptionsBase.AutoGrid is set to false).

    The next steps illustrate how to format axis labels using their built-in Argument placeholder together with the format specifier.

  3. To specify a pattern for axis labels, expand Label in the Properties window and locate the AxisLabel.TextPattern property. Then, click the ellipsis button.

  4. In the invoked Pattern Editor, double click Argument in the 'Placeholders:' column. Then, select the dd-MMM-yy format in the 'Format:' column to display day, month and year in the axis labels. You can see the final pattern in the 'Pattern:' column.

  5. To apply the pattern, click OK. This closes the Pattern Editor.

The result is shown in the following image.

You can also specify this text pattern for axis labels via the Chart Designer.

Expanded See Also

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