Category / Section
How to add space between axis title and labels in UWP Charts
1 min read
This article explains how to change the distance between the axis labels and the title in UWP chart. It has been achieved by using the LabelExtent property of axis as shown in the following code sample.
[XAML]
LabelExtent property usage in X-axis
<syncfusion:SfChart Header="Project Cost Breakdown" >
<!--Initialize the horizontal axis for SfChart-->
<syncfusion:SfChart.PrimaryAxis>
<syncfusion:CategoryAxis Header="Project" FontSize="14" LabelExtent="300" />
</syncfusion:SfChart.PrimaryAxis>
<!--Initialize the vertical axis for SfChart-->
<syncfusion:SfChart.SecondaryAxis>
<syncfusion:NumericalAxis Header="Cost" FontSize="14" Maximum="30" />
</syncfusion:SfChart.SecondaryAxis>
<!--Initialize the series for SfChart-->
<syncfusion:BarSeries ItemsSource="{Binding Data}" Palette="Metro" XBindingPath="XValue" YBindingPath="YValue" ShowTooltip="True" >
</syncfusion:BarSeries>
</syncfusion:SfChart>
Output
[XAML]
LabelExtent property usage in Y-axis
<syncfusion:SfChart Header="Project Cost Breakdown" >
<!--Initialize the horizontal axis for SfChart-->
<syncfusion:SfChart.PrimaryAxis>
<syncfusion:CategoryAxis Header="Project" FontSize="14" />
</syncfusion:SfChart.PrimaryAxis>
<!--Initialize the vertical axis for SfChart-->
<syncfusion:SfChart.SecondaryAxis>
<syncfusion:NumericalAxis Header="Cost" FontSize="14" Maximum="30" LabelExtent="300" />
</syncfusion:SfChart.SecondaryAxis>
<!--Initialize the series for SfChart-->
<syncfusion:BarSeries ItemsSource="{Binding Data}" Palette="Metro" XBindingPath="XValue" YBindingPath="YValue" ShowTooltip="True" >
</syncfusion:BarSeries>
</syncfusion:SfChart>
Output
See also
How to bind the SQL Database in UWP Chart
How to wrap the multi-level axis label's text in WPF Chart
How to apply the custom labels in UWP LogarithmicAxis
How to get axis range in chart
