Axis Titles

• May 06, 2024
• 4 minutes to read

This document describes how axis titles can be displayed and customized, and gives a short description of their properties.

This document consists of the following sections.

• Axis Titles Overview
• Axis Titles Hit-Testing

Axis Titles Overview

For both a diagram’s primary and secondary axes, it’s possible to display and customize their text titles, which are shown in the following image.

Note that for each axis it’s only possible to display a single AxisTitle object at a time. And, a chart’s accompanying information can be displayed using chart titles, an unlimited number of which are supported.

Note

The Chart Control can hide its elements if there is insufficient space to display them. Elements are hidden in the following order:

1. Legends
2. Axis Titles
3. Series Titles
4. Pane Titles
5. Axes
6. Chart Title
7. Breadcrumbs

To make the Chart Control always display its elements, disable the ChartControl.AutoLayout property.

To display an axis title at design time, click on the required axis within the chart diagram, to select it. Then, in the Properties window, expand the Axis2D.Title property, and set the TitleBase.Visible property to true.

An axis title’s customization options are briefly described below.

• The AxisTitle.Alignment property determines the alignment of the title along the axis.
• The TitleBase.EnableAntialiasing property allows you to apply antialiasing to the title’s font. In some cases, this may help to improve the readability of the font.
• The TitleBase.DXFont property controls the options which specify the font used to display the title’s text.
• The Title.Text property allows you to enter the required text for the title. You can use HTML-style markup tags to format the title’s text.
• The TitleBase.TextColor property determines the title’s color.

The following example shows how to customize axis titles:

View Example: How to Create and Customize an Axis Title

C#

using System;
using System.Drawing;
using System.Windows.Forms;
using DevExpress.Drawing;
using DevExpress.XtraCharts;

namespace AxisTitle {
    public partial class Form1 : Form {
        public Form1() {
            InitializeComponent();
        }
        private void Form1_Load(object sender, EventArgs e) {
        // ...
            // Cast the chart's diagram to the XYDiagram type, to access its axes.
            XYDiagram diagram = chartControl1.Diagram as XYDiagram;

            // Customize the appearance of the X-axis title.
            diagram.AxisX.Title.Visibility = DevExpress.Utils.DefaultBoolean.True;
            diagram.AxisX.Title.Alignment = StringAlignment.Center;
            diagram.AxisX.Title.Text = "<i>X-axis</i> <color=violet>Title</color>";
            diagram.AxisX.Title.TextColor = Color.Red;
            diagram.AxisX.Title.EnableAntialiasing = DevExpress.Utils.DefaultBoolean.True;
            diagram.AxisX.Title.DXFont = new DXFont("Tahoma", 14, DXFontStyle.Bold);

            // Customize the appearance of the Y-axis title.
            diagram.AxisY.Title.Visibility = DevExpress.Utils.DefaultBoolean.True;
            diagram.AxisY.Title.Alignment = StringAlignment.Center;
            diagram.AxisY.Title.Text = "Y-axis Title";
            diagram.AxisY.Title.TextColor = Color.Blue;
            diagram.AxisY.Title.EnableAntialiasing = DevExpress.Utils.DefaultBoolean.True;
            diagram.AxisY.Title.DXFont = new DXFont("Tahoma", 14, DXFontStyle.Bold);

            // Add the chart to the form.
            chartControl1.Dock = DockStyle.Fill;
            this.Controls.Add(chartControl1);
        }
    }
}

VB.NET

Imports System
Imports System.Drawing
Imports System.Windows.Forms
Imports DevExpress.Drawing
Imports DevExpress.XtraCharts

Namespace AxisTitle

    Public Partial Class Form1
        Inherits Form

        Public Sub New()
            InitializeComponent()
        End Sub

        Private Sub Form1_Load(ByVal sender As Object, ByVal e As EventArgs)
        ' ...
            ' Cast the chart's diagram to the XYDiagram type, to access its axes.
            Dim diagram As XYDiagram = TryCast(chartControl1.Diagram, XYDiagram)
            ' Customize the appearance of the X-axis title.
            diagram.AxisX.Title.Visibility = DevExpress.Utils.DefaultBoolean.True
            diagram.AxisX.Title.Alignment = StringAlignment.Center
            diagram.AxisX.Title.Text = "<i>X-axis</i> <color=violet>Title</color>"
            diagram.AxisX.Title.TextColor = Color.Red
            diagram.AxisX.Title.EnableAntialiasing = DevExpress.Utils.DefaultBoolean.True
            diagram.AxisX.Title.DXFont = New DXFont("Tahoma", 14, DXFontStyle.Bold)
            ' Customize the appearance of the Y-axis title.
            diagram.AxisY.Title.Visibility = DevExpress.Utils.DefaultBoolean.True
            diagram.AxisY.Title.Alignment = StringAlignment.Center
            diagram.AxisY.Title.Text = "Y-axis Title"
            diagram.AxisY.Title.TextColor = Color.Blue
            diagram.AxisY.Title.EnableAntialiasing = DevExpress.Utils.DefaultBoolean.True
            diagram.AxisY.Title.DXFont = New DXFont("Tahoma", 14, DXFontStyle.Bold)
            ' Add the chart to the form.
            chartControl1.Dock = DockStyle.Fill
            Me.Controls.Add(chartControl1)
        End Sub
    End Class
End Namespace

Axis Titles Hit-Testing

As with the majority of other chart elements, hit testing is supported for axis titles, as well. This means that you can display any additional information related to the corresponding axis (e.g. its name or type) for your end-users after they click or hover its title.

You can obtain an axis title in the ChartControl.ObjectHotTracked event. For more information, refer to How to: Determine whether an Axis Title is Being Hovered by the Mouse Pointer.