Axes

• Mar 19, 2021

The Cartesian chart contains two perpendicular axes - the argument axis (the X-axis) and the value axis (the Y-axis). The chart uses axes to display data points according to their arguments and values on the coordinate system.

You can show the following axis elements to make the chart’s data easier to read:

• Gridlines
• Tickmarks
• Axis Labels
• Strips
• Interlacing

The example below displays axis lines, customizes axis labels, and enables interlacing for the X-axis:

XAML

<Charts:CartesianChart x:Name="chart"  Grid.Row="1">
    <Charts:CartesianChart.AxisX>
        <Charts:AxisX x:Name="axisX" ShowLine="True" Interlaced="True" InterlacedBrush="AliceBlue">
            <Charts:AxisX.LabelOptions>
                <Charts:AxisLabelOptions Pattern="{}{V} year"/>
            </Charts:AxisX.LabelOptions>
        </Charts:AxisX>
    </Charts:CartesianChart.AxisX>
    <Charts:CartesianChart.AxisY>
        <Charts:AxisY x:Name="axisY" ShowLine="True">
            <Charts:AxisY.Title>
                <Charts:AxisTitle Content="Population mid-year in millions"/>
            </Charts:AxisY.Title>
            <Charts:AxisY.LabelOptions>
                <Charts:AxisLabelOptions Pattern="{}{V}"/>
            </Charts:AxisY.LabelOptions>
        </Charts:AxisY>
    </Charts:CartesianChart.AxisY>
   <Charts:CartesianChart.Series>
        <Charts:Series x:Name="seriesErope" DisplayName="Europe">
            <Charts:Series.Data>
                <Charts:DataPointCollection>
                    <Charts:DataPoint Argument="1950" Value="546"/>
                    <!--...-->
                    <Charts:DataPoint Argument="2020" Value="721"/>
                </Charts:DataPointCollection>
            </Charts:Series.Data>
        </Charts:Series>
        <!--...-->
    </Charts:CartesianChart.Series>
</Charts:CartesianChart>

The example uses API members listed in the table below:

Property	Description
AxisBase.Interlaced	Gets or sets whether interlacing is applied to the axis.
AxisBase.InterlacedBrush	Gets or sets the interlacing color.
AxisBase.LabelOptions	Specifies axis label settings.
AxisBase.ShowLine	Specifies whether to display the axis line.
AxisLabelOptions	Contains options that define appearance and behavior of axis labels.
AxisLabelOptions.Pattern	Gets or sets the format string that specifies the axis label text.