Axis Titles
- 2 minutes to read
The 2D XY Diagram‘s axes (both primary and secondary ones) can have a title.
This document consists of the following sections:
Note
The Chart Control can hide its elements if there is insufficient space to display them. Elements are hidden in the following order:
- Legends
- Axis Titles
- Series Titles
- Pane Titles
- Axes
- Chart Title
- Breadcrumbs
To make the Chart Control always display its elements, disable the Chart
#How to Add a Title to an Axis
The markup below shows how to create titles for x- and y-axes and specify their content:
<dxc:XYDiagram2D>
<dxc:XYDiagram2D.AxisX>
<dxc:AxisX2D>
<dxc:AxisX2D.Title>
<dxc:AxisTitle Content="Year"/>
</dxc:AxisX2D.Title>
</dxc:AxisX2D>
</dxc:XYDiagram2D.AxisX>
<dxc:XYDiagram2D.AxisY>
<dxc:AxisY2D>
<dxc:AxisY2D.Title>
<dxc:AxisTitle Content="Oil Price (USD)"/>
</dxc:AxisY2D.Title>
</dxc:AxisY2D>
</dxc:XYDiagram2D.AxisY>
<!--...-->
</dxc:XYDiagram2D>
Use the following classes and properties to configure axis titles:
Class or Property | Description |
---|---|
XYDiagram2D | The XY Diagram. |
XYDiagram2D. |
Gets or sets an x-axis. |
XYDiagram2D. |
Gets or sets a y-axis. |
Axis |
An x-axis. |
Axis |
A y-axis. |
Axis. |
Gets or sets the axis title’s options. |
Axis |
The axis title. |
Title |
The axis title’s content. |
#How to Modify Title Appearance
The Chart control makes it possible to alter the axis title’s appearance in different ways. For example, you can assign a DataTemplate object to the TitleBase.ContentTemplate property.
The following XAML markup shows how to do this:
<Window.Resources>
<DataTemplate x:Key="axisTitle">
<TextBlock Text="{Binding}"
Foreground="Black"
FontFamily="SegoeUI"
FontStyle="Italic"
FontSize="16"
FontWeight="Medium"
FontStretch="Normal">
</TextBlock>
</DataTemplate>
</Window.Resources>
<!--...-->
<dxc:XYDiagram2D.AxisY>
<dxc:AxisY2D>
<dxc:AxisY2D.Title>
<dxc:AxisTitle Content="Oil Price (USD)"
ContentTemplate="{StaticResource axisTitle}"
Alignment="Center"/>
</dxc:AxisY2D.Title>
</dxc:AxisY2D>
</dxc:XYDiagram2D.AxisY>
Use the following properties to apply a data template for axis title customization:
Property | Description |
---|---|
Title |
Specifies a axis title content. |
Title |
Gets or sets a template that specifies how the title looks. |
Axis |
Gets or sets the axis title’s alignment. |