menu

Class ChartAxis - WinUI API Reference | Syncfusion

    Show / Hide Table of Contents

    Class ChartAxis

    The ChartAxis is the base class for all types of axes.

    Inheritance
    System.Object
    ChartAxis
    CategoryAxis
    RangeAxisBase
    Implements
    System.ComponentModel.INotifyPropertyChanged
    Namespace: Syncfusion.UI.Xaml.Charts
    Assembly: Syncfusion.Chart.WinUI.dll
    Syntax
    public abstract class ChartAxis : Control, INotifyPropertyChanged
    Remarks

    The ChartAxis is used to locate a data point inside the chart area. Charts typically have two axes that are used to measure and categorize data.

    The vertical(y) axis always uses numerical scale.

    The horizontal(x) axis supports the Category, Numeric and Date-time.

    Constructors

    ChartAxis()

    Initializes a new instance of the ChartAxis class.

    Declaration
    public ChartAxis()

    Fields

    AutoScrollingDeltaProperty

    The DependencyProperty for AutoScrollingDelta property.

    Declaration
    public static readonly DependencyProperty AutoScrollingDeltaProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    AutoScrollingModeProperty

    The DependencyProperty for AutoScrollingMode property..

    Declaration
    public static readonly DependencyProperty AutoScrollingModeProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    AxisLineOffsetProperty

    The DependencyProperty for AxisLineOffset property.

    Declaration
    public static readonly DependencyProperty AxisLineOffsetProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    AxisLineStyleProperty

    The DependencyProperty for AxisLineStyle property.

    Declaration
    public static readonly DependencyProperty AxisLineStyleProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    CrosshairLabelTemplateProperty

    The DependencyProperty for CrosshairLabelTemplate property.

    Declaration
    public static readonly DependencyProperty CrosshairLabelTemplateProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    EdgeLabelsDrawingModeProperty

    The DependencyProperty for EdgeLabelsDrawingMode property.

    Declaration
    public static readonly DependencyProperty EdgeLabelsDrawingModeProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    EnableAutoIntervalOnZoomingProperty

    The DependencyProperty for EnableAutoIntervalOnZooming property.

    Declaration
    public static readonly DependencyProperty EnableAutoIntervalOnZoomingProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    HeaderProperty

    The DependencyProperty for Header property.

    Declaration
    public static readonly DependencyProperty HeaderProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    HeaderStyleProperty

    The DependencyProperty for HeaderStyle property.

    Declaration
    public static readonly DependencyProperty HeaderStyleProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    HeaderTemplateProperty

    The DependencyProperty for HeaderTemplate property.

    Declaration
    public static readonly DependencyProperty HeaderTemplateProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    IsInversedProperty

    The DependencyProperty for IsInversed property.

    Declaration
    public static readonly DependencyProperty IsInversedProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    LabelExtentProperty

    The DependencyProperty for LabelExtent property.

    Declaration
    public static readonly DependencyProperty LabelExtentProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    LabelRotationProperty

    The DependencyProperty for LabelRotation property.

    Declaration
    public static readonly DependencyProperty LabelRotationProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    LabelsIntersectActionProperty

    The DependencyProperty for LabelsIntersectAction property.

    Declaration
    public static readonly DependencyProperty LabelsIntersectActionProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    LabelStyleProperty

    The DependencyProperty for LabelStyle property.

    Declaration
    public static readonly DependencyProperty LabelStyleProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    LabelTemplateProperty

    The DependencyProperty for LabelTemplate property.

    Declaration
    public static readonly DependencyProperty LabelTemplateProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    MajorGridLineStyleProperty

    The DependencyProperty for MajorGridLineStyle property.

    Declaration
    public static readonly DependencyProperty MajorGridLineStyleProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    MajorTickStyleProperty

    The DependencyProperty for MajorTickStyle property.

    Declaration
    public static readonly DependencyProperty MajorTickStyleProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    OpposedPositionProperty

    The DependencyProperty for OpposedPosition property.

    Declaration
    public static readonly DependencyProperty OpposedPositionProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    PlotOffsetEndProperty

    The DependencyProperty for PlotOffsetEnd property.

    Declaration
    public static readonly DependencyProperty PlotOffsetEndProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    PlotOffsetStartProperty

    The DependencyProperty for PlotOffsetStart property.

    Declaration
    public static readonly DependencyProperty PlotOffsetStartProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ShowMajorGridLinesProperty

    The DependencyProperty for ShowMajorGridLines property.

    Declaration
    public static readonly DependencyProperty ShowMajorGridLinesProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ShowTrackballLabelProperty

    The DependencyProperty for ShowTrackballLabel property.

    Declaration
    public static readonly DependencyProperty ShowTrackballLabelProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    TickLineSizeProperty

    The DependencyProperty for TickLineSize property.

    Declaration
    public static readonly DependencyProperty TickLineSizeProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    TrackballLabelTemplateProperty

    The DependencyProperty for TrackballLabelTemplate property.

    Declaration
    public static readonly DependencyProperty TrackballLabelTemplateProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ZoomFactorProperty

    The DependencyProperty for ZoomFactor property.

    Declaration
    public static readonly DependencyProperty ZoomFactorProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    ZoomPositionProperty

    The DependencyProperty for ZoomPosition property.

    Declaration
    public static readonly DependencyProperty ZoomPositionProperty
    Field Value
    Type
    Microsoft.UI.Xaml.DependencyProperty

    Properties

    AutoScrollingDelta

    Gets or sets the value that determines the range of values to be visible during auto scrolling.

    Declaration
    public double AutoScrollingDelta { get; set; }
    Property Value
    Type Description
    System.Double

    This property takes the System.Double as its value.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
       <chart:SfCartesianChart.XAxes>
           <chart:CategoryAxis AutoScrollingDelta="3"/>
       </chart:SfCartesianChart.XAxes>
       <chart:SfCartesianChart.YAxes>
           <chart:NumericalAxis AutoScrollingDelta="2"/>
       </chart:SfCartesianChart.YAxes>
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xAxis = new CategoryAxis();
    xAxis.AutoScrollingDelta = 3;
    
    NumericalAxis yAxis = new NumericalAxis();
    yaxis.AutoScrollingDelta = 2;
    
    chart.XAxes.Add(xAxis);	
    chart.YAxes.Add(yAxis);	

    AutoScrollingMode

    Gets or sets the enum ChartAutoScrollingMode to determine whether the axis should be auto scrolled at start or end position.

    Declaration
    public ChartAutoScrollingMode AutoScrollingMode { get; set; }
    Property Value
    Type Description
    ChartAutoScrollingMode

    This property takes the ChartAutoScrollingMode as its value.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
       <chart:SfCartesianChart.XAxes>
           <chart:CategoryAxis AutoScrollingMode="Start"/>
       </chart:SfCartesianChart.XAxes>
       <chart:SfCartesianChart.YAxes>
           <chart:NumericalAxis AutoScrollingMode="End"/>
       </chart:SfCartesianChart.YAxes>
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xAxis = new CategoryAxis();
    xAxis.AutoScrollingMode = ChartAutoScrollingMode.Start;
    
    NumericalAxis yAxis = new NumericalAxis();
    yaxis.AutoScrollingMode = ChartAutoScrollingMode.End;
    
    chart.XAxes.Add(xAxis);	
    chart.YAxes.Add(yAxis);	

    AxisLineOffset

    Gets or sets a value to provide padding to the axis line.

    Declaration
    public double AxisLineOffset { get; set; }
    Property Value
    Type Description
    System.Double

    It accepts double values and its default value is 0.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis AxisLineOffset = "30" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       AxisLineOffset = 30
    };
    chart.XAxes.Add(xaxis);

    AxisLineStyle

    Gets or sets the value to customize the appearance of the chart axis line.

    Declaration
    public Style AxisLineStyle { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Style

    This property accepts the Microsoft.UI.Xaml.Style value.

    Remarks

    To customize the axis line appearance, you need to create an instance of the Microsoft.UI.Xaml.Style class and set to the AxisLineStyle property.

    Examples
    • MainWindow.xaml
    • MainWindow.cs
        <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:NumericalAxis>
                    <chart:NumericalAxis.AxisLineStyle>
                        <Style TargetType = "Line" >
                            <Setter Property="StrokeThickness" Value="2"/>
                            <Setter Property = "Stroke" Value="Red" />
                        </Style>
                    </chart:NumericalAxis.AxisLineStyle>
                </chart:NumericalAxis>
            </chart:SfCartesianChart.XAxes>
    
            <chart:SfCartesianChart.YAxes>
                <chart:NumericalAxis/>
            </chart:SfCartesianChart.YAxes>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
    
        NumericalAxis xAxis = new NumericalAxis();
        Style axisLineStyle = new Style() { TargetType = typeof(Line), };
        axisLineStyle.Setters.Add(new Setter(Path.StrokeThicknessProperty, 2));
        axisLineStyle.Setters.Add(new Setter(Path.StrokeProperty, new SolidColorBrush(Colors.Red)));
        xAxis.AxisLineStyle = axisLineStyle;
        chart.XAxes.Add(xAxis);
    
        NumericalAxis yAxis = new NumericalAxis();
        chart.YAxes.Add(yAxis);

    CrosshairLabelTemplate

    Gets or sets the custom template to customize the appearance of the crosshair labels.

    Declaration
    public DataTemplate CrosshairLabelTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.DataTemplate

    It accepts the Microsoft.UI.Xaml.DataTemplate value.

    Examples
    • MainPage.xaml
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.CrosshairBehavior>
           <chart:ChartCrosshairBehavior />
       </chart:SfCartesianChart.CrosshairBehavior>
    
       <chart:SfCartesianChart.XAxes>
           <chart:CategoryAxis ShowTrackballLabel = "True" >
              <chart:CategoryAxis.CrosshairLabelTemplate>
                   <DataTemplate>
                       <Border CornerRadius = "5" BorderThickness="1" 
                               BorderBrush="Black" Background="LightGreen" Padding="5">
                           <TextBlock Foreground = "Black" Text="{Binding ValueX}"/>
                       </Border>
                   </DataTemplate>
               </chart:CategoryAxis.CrosshairLabelTemplate>
           </chart:CategoryAxis>
       </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>

    EdgeLabelsDrawingMode

    Gets or sets a value to customize the rendering position of the edge labels.

    Declaration
    public EdgeLabelsDrawingMode EdgeLabelsDrawingMode { get; set; }
    Property Value
    Type Description
    EdgeLabelsDrawingMode

    It accepts the EdgeLabelsDrawingMode value and its default value is Center.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis EdgeLabelsDrawingMode="Fit" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       EdgeLabelsDrawingMode= EdgeLabelsDrawingMode.Fit,
    };
    chart.XAxes.Add(xaxis);

    EnableAutoIntervalOnZooming

    Gets or sets a value indicating whether to calculate the axis intervals on zooming.

    Declaration
    public bool EnableAutoIntervalOnZooming { get; set; }
    Property Value
    Type Description
    System.Boolean

    It accepts the bool values and its default value is True.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis EnableAutoIntervalOnZooming = "False" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       EnableAutoIntervalOnZooming = false,
    };
    chart.XAxes.Add(xaxis);

    Header

    Gets or sets a value for the chart axis header.

    Declaration
    public object Header { get; set; }
    Property Value
    Type Description
    System.Object

    It accepts any Microsoft.UI.Xaml.UIElement as content.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis Header="XValue" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       Header="XValue",
    };
    chart.XAxes.Add(xaxis);

    HeaderStyle

    Gets or sets the label style to customize the appearance of the chart axis header.

    Declaration
    public LabelStyle HeaderStyle { get; set; }
    Property Value
    Type Description
    LabelStyle

    It accepts the LabelStyle value.

    Examples
    • MainWindow.xaml
    • MainWindow.cs
        <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:NumericalAxis Header="XValue">
                    <chart:NumericalAxis.HeaderStyle>
                        <chart:LabelStyle Foreground = "Red"/>
                    </chart:NumericalAxis.HeaderStyle>
                </chart:NumericalAxis>
            </chart:SfCartesianChart.XAxes>
    
            <chart:SfCartesianChart.YAxes>
                <chart:NumericalAxis/>
            </chart:SfCartesianChart.YAxes>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
    
        NumericalAxis xAxis = new NumericalAxis() { Header = "XValue" };
        LabelStyle headerStyle = new LabelStyle() { Foreground = new SolidColorBrush(Colors.Red) };
        xAxis.HeaderStyle = headerStyle;
        chart.XAxes.Add(xAxis);
    
        NumericalAxis yAxis = new NumericalAxis();
        chart.YAxes.Add(yAxis);

    HeaderTemplate

    Gets or sets the custom template to customize the appearance of the chart axis header.

    Declaration
    public DataTemplate HeaderTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.DataTemplate

    It accepts the Microsoft.UI.Xaml.DataTemplate value.

    Examples
    • MainWindow.xaml
        <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:NumericalAxis Header="XValue">
                    <chart:NumericalAxis.HeaderTemplate>
                        <DataTemplate>
                            <Border Background = "LightGreen" >
                                <TextBlock Text="{Binding}" Margin="5" />
                            </Border>
                        </DataTemplate>
                    </chart:NumericalAxis.HeaderTemplate>
                </chart:NumericalAxis>
            </chart:SfCartesianChart.XAxes>
    
            <chart:SfCartesianChart.YAxes>
                <chart:NumericalAxis/>
            </chart:SfCartesianChart.YAxes>
    
        </chart:SfCartesianChart>

    IsInversed

    Gets or sets the value that indicates whether the axis's visible range is inversed.

    Declaration
    public bool IsInversed { get; set; }
    Property Value
    Type Description
    System.Boolean

    It accepts the bool values and its default value is False.

    Remarks

    When the axis is inversed, it will render points from right to left for the horizontal axis, and top to bottom for the vertical axis.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis IsInversed ="True" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       IsInversed = true,
    };
    chart.XAxes.Add(xaxis);

    LabelExtent

    Gets or sets the value that determines the distance between the axis label and axis header.

    Declaration
    public double LabelExtent { get; set; }
    Property Value
    Type Description
    System.Double

    It accepts the double values and the default value is 0.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis Header="XValue" LabelExtent="50" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       Header="XValue",
       LabelExtent = 50
    };
    chart.XAxes.Add(xaxis);

    LabelRotation

    Gets or sets the value for the rotation angle of the axis labels.

    Declaration
    public double LabelRotation { get; set; }
    Property Value
    Type Description
    System.Double

    It accepts the double values and the default value is 0.

    Remarks

    The label will be rotated with the center as the origin.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis LabelRotation = "90" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       LabelRotation = 90,
    };
    chart.XAxes.Add(xaxis);

    LabelsIntersectAction

    Gets or sets a value indicating the actions to be taken when two labels intersect.

    Declaration
    public AxisLabelsIntersectAction LabelsIntersectAction { get; set; }
    Property Value
    Type Description
    AxisLabelsIntersectAction

    It accepts the AxisLabelsIntersectAction values and the default value is Hide.

    Remarks

    Overlapping labels can be hidden, rotated, or moved to the next row.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis LabelsIntersectAction="Auto" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       LabelsIntersectAction = AxisLabelsIntersectAction.Auto,
    };
    chart.XAxes.Add(xaxis);

    LabelStyle

    Gets or sets the value to customize the appearance of chart axis labels.

    Declaration
    public LabelStyle LabelStyle { get; set; }
    Property Value
    Type Description
    LabelStyle

    It accepts the LabelStyle value.

    Remarks

    To customize the axis labels appearance, you need to create an instance of the LabelStyle class and set to the LabelStyle property.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis>
               <chart:CategoryAxis.LabelStyle>
                   <chart:LabelStyle Foreground = "Red" FontSize="14"/>
               </chart:CategoryAxis.LabelStyle>
           </chart:CategoryAxis>
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis();
    xaxis.LabelStyle = new LabelStyle()
    {
        Foreground = new SolidColorBrush(Colors.Red),
        FontSize = 14,
    };
    chart.XAxes.Add(xaxis);

    LabelTemplate

    Gets or sets the custom template to customize the appearance of the axis labels.

    Declaration
    public DataTemplate LabelTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.DataTemplate

    It accepts the Microsoft.UI.Xaml.DataTemplate values.

    Examples
    • MainPage.xaml
    <chart:SfCartesianChart>
    
       <chart:SfCartesianChart.XAxes>
           <chart:CategoryAxis ShowTrackballLabel = "True" >
               <chart:CategoryAxis.LabelTemplate>
                   <DataTemplate>
                       <TextBlock Foreground = "Red" Text="{Binding Content}" />
                   </DataTemplate>
               </chart:CategoryAxis.LabelTemplate>
           </chart:CategoryAxis>
       </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>

    MajorGridLineStyle

    Gets or sets the style to customize the appearance of the major grid lines.

    Declaration
    public Style MajorGridLineStyle { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Style

    It accepts the Microsoft.UI.Xaml.Style value.

    Examples
    • MainWindow.xaml
    • MainWindow.cs
        <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:NumericalAxis>
                    <chart:NumericalAxis.MajorGridLineStyle>
                        <Style TargetType = "Line" >
                            <Setter Property="StrokeThickness" Value="2"/>
                            <Setter Property = "Stroke" Value="Red" />
                        </Style>
                    </chart:NumericalAxis.MajorGridLineStyle>
                </chart:NumericalAxis>
            </chart:SfCartesianChart.XAxes>
    
            <chart:SfCartesianChart.YAxes>
                <chart:NumericalAxis/>
            </chart:SfCartesianChart.YAxes>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
    
        NumericalAxis xAxis = new NumericalAxis();
        Style majorGridLineStyle = new Style() { TargetType = typeof(Line), };
        majorGridLineStyle.Setters.Add(new Setter(Path.StrokeThicknessProperty, 2));
        majorGridLineStyle.Setters.Add(new Setter(Path.StrokeProperty, new SolidColorBrush(Colors.Red)));
        xAxis.MajorGridLineStyle = majorGridLineStyle;
        chart.XAxes.Add(xAxis);
    
        NumericalAxis yAxis = new NumericalAxis();
        chart.YAxes.Add(yAxis);

    MajorTickStyle

    Gets or sets the style to customize the appearance of the major tick lines.

    Declaration
    public Style MajorTickStyle { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.Style

    It accepts the Microsoft.UI.Xaml.Style value.

    Examples
    • MainWindow.xaml
    • MainWindow.cs
        <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:NumericalAxis>
                    <chart:NumericalAxis.MajorTickStyle>
                        <Style TargetType = "Line" >
                            <Setter Property="StrokeThickness" Value="2"/>
                            <Setter Property = "Stroke" Value="Red" />
                        </Style>
                    </chart:NumericalAxis.MajorTickStyle>
                </chart:NumericalAxis>
            </chart:SfCartesianChart.XAxes>
    
            <chart:SfCartesianChart.YAxes>
                <chart:NumericalAxis/>
            </chart:SfCartesianChart.YAxes>
    
        </chart:SfCartesianChart>
        SfCartesianChart chart = new SfCartesianChart();
    
        NumericalAxis xAxis = new NumericalAxis();
        Style majorTickStyle = new Style() { TargetType = typeof(Line), };
        majorTickStyle.Setters.Add(new Setter(Path.StrokeThicknessProperty, 2));
        majorTickLStyle.Setters.Add(new Setter(Path.StrokeProperty, new SolidColorBrush(Colors.Red)));
        xAxis.MajorTickStyle = majorTickStyle;
        chart.XAxes.Add(xAxis);
    
        NumericalAxis yAxis = new NumericalAxis();
        chart.YAxes.Add(yAxis);

    OpposedPosition

    Gets or sets a value indicating whether to enable the axis to a position opposite its actual position.

    Declaration
    public bool OpposedPosition { get; set; }
    Property Value
    Type Description
    System.Boolean

    It accepts bool values and the default vaue is False.

    Remarks

    That is, the other side of plot area.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis OpposedPosition="True" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       OpposedPosition = true,
    };
    chart.XAxes.Add(xaxis);

    PlotOffsetEnd

    Gets or sets a value to provide padding to the axis at end position.

    Declaration
    public double PlotOffsetEnd { get; set; }
    Property Value
    Type Description
    System.Double

    It accepts double values and its default value is 0.

    Remarks

    PlotOffsetEnd applies padding at end of the plot area where the axis and its elements are rendered in the chart with padding at the end.

    PlotOffsetEnd is not applicable for polar and radar chart series.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis PlotOffsetEnd = "30" />
        </chart:SfCartesianChart.XAxes>
    
        <chart:SfCartesianChart.YAxes>
            <chart:NumericalAxis PlotOffsetEnd = "30" />
        </chart:SfCartesianChart.YAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       PlotOffsetEnd = 30
    };
    
    NumericalAxis yaxis = new NumericalAxis()
    {
       PlotOffsetEnd = 30
    };
    
    chart.XAxes.Add(xaxis);
    chart.YAxes.Add(yaxis);

    PlotOffsetStart

    Gets or sets a value to provide padding to the axis at the start position.

    Declaration
    public double PlotOffsetStart { get; set; }
    Property Value
    Type Description
    System.Double

    It accepts double values and its default value is 0.

    Remarks

    PlotOffsetStart applies padding at the start of a plot area where the axis and its elements are rendered in a chart with padding at the start.

    PlotOffsetStart is not applicable for the polar and radar chart series.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis PlotOffsetStart = "30" />
        </chart:SfCartesianChart.XAxes>
    
        <chart:SfCartesianChart.YAxes>
            <chart:NumericalAxis PlotOffsetStart = "30" />
        </chart:SfCartesianChart.YAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       PlotOffsetStart = 30
    };
    
    NumericalAxis yaxis = new NumericalAxis()
    {
       PlotOffsetStart = 30
    };
    
    chart.XAxes.Add(xaxis);
    chart.YAxes.Add(yaxis);

    ShowMajorGridLines

    Gets or sets a value indicating whether the axis grid lines can be displayed or not.

    Declaration
    public bool ShowMajorGridLines { get; set; }
    Property Value
    Type Description
    System.Boolean

    It accepts the bool value and its default value is True.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis ShowMajorGridLines = "False" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       ShowMajorGridLines = false,
    };
    chart.XAxes.Add(xaxis);

    ShowTrackballLabel

    Gets or sets the value that indicates whether to show the axis information when the trackball is shown.

    Declaration
    public bool ShowTrackballLabel { get; set; }
    Property Value
    Type Description
    System.Boolean

    It accepts the bool value and its default value is False.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis ShowTrackballLabel = "True" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       ShowTrackballLabel = true,
    };
    chart.XAxes.Add(xaxis);

    TickLineSize

    Gets or sets a value to modify the axis tick line size.

    Declaration
    public double TickLineSize { get; set; }
    Property Value
    Type Description
    System.Double

    It accepts double values and its default value is 8.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis TickLineSize="15" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis()
    {
       TickLineSize = 15,
    };
    chart.XAxes.Add(xaxis);

    TrackballLabelTemplate

    Gets or sets the custom template to customize the appearance of the chart axis trackball label.

    Declaration
    public DataTemplate TrackballLabelTemplate { get; set; }
    Property Value
    Type Description
    Microsoft.UI.Xaml.DataTemplate

    It accepts the Microsoft.UI.Xaml.DataTemplate value.

    Examples
    • MainPage.xaml
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.TrackballBehavior>
           <chart:ChartTrackballBehavior />
       </chart:SfCartesianChart.TrackballBehavior>
    
       <chart:SfCartesianChart.XAxes>
           <chart:CategoryAxis ShowTrackballLabel = "True" >
               <chart:CategoryAxis.TrackballLabelTemplate>
                   <DataTemplate>
                       <Border CornerRadius = "5" BorderThickness="1" 
                               BorderBrush="Black" Background="LightGreen" Padding="5">
                           <TextBlock Foreground = "Black" Text="{Binding ValueX}"/>
                       </Border>
                   </DataTemplate>
               </chart:CategoryAxis.TrackballLabelTemplate>
           </chart:CategoryAxis>
       </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>

    VisibleMaximum

    Gets the double value that represents the maximum visible value of the axis range.

    Declaration
    public double VisibleMaximum { get; }
    Property Value
    Type
    System.Double

    VisibleMinimum

    Gets the double value that represents the minimum visible value of the axis range.

    Declaration
    public double VisibleMinimum { get; }
    Property Value
    Type
    System.Double

    ZoomFactor

    Gets or sets the value that defines the percentage of the visible range from the total range of axis values.

    Declaration
    public double ZoomFactor { get; set; }
    Property Value
    Type Description
    System.Double

    It accepts the double values and its default value is 1.

    Remarks

    The value must be between 0 and 1.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:CategoryAxis ZoomFactor="0.3" ZoomPosition="0.5" />
            </chart:SfCartesianChart.XAxes>
    
            <chart:SfCartesianChart.ZoomPanBehavior>
                 <chart:ChartZoomPanBehavior/>
            </chart:SfCartesianChart.ZoomPanBehavior>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis(){  ZoomFactor = 0.3, ZoomPosition = 0.5  };
    chart.XAxes.Add(xaxis);	
    
    ChartZoomPanBehavior zoomPanBehavior = new ChartZoomPanBehavior();
    chart.ZoomPanBehavior = zoomPanBehavior;

    ZoomPosition

    Gets or sets the value that defines the zoom position for the actual range of the axis.

    Declaration
    public double ZoomPosition { get; set; }
    Property Value
    Type Description
    System.Double

    It accepts the double values and its default value is 0.

    Remarks

    The value must be between 0 and 1.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:CategoryAxis ZoomFactor="0.3" ZoomPosition="0.5" />
            </chart:SfCartesianChart.XAxes>
    
            <chart:SfCartesianChart.ZoomPanBehavior>
                 <chart:ChartZoomPanBehavior/>
            </chart:SfCartesianChart.ZoomPanBehavior>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis(){  ZoomFactor = 0.3, ZoomPosition = 0.5  };
    chart.XAxes.Add(xaxis);
    
    chart.ZoomPanBehavior = new ChartZoomPanBehavior();

    Methods

    ApplyRangePadding(DoubleRange, Double)

    Declaration
    protected virtual DoubleRange ApplyRangePadding(DoubleRange range, double interval)
    Parameters
    Type Name Description
    DoubleRange range
    System.Double interval
    Returns
    Type
    DoubleRange

    CalculateActualInterval(DoubleRange, Size)

    Declaration
    protected virtual double CalculateActualInterval(DoubleRange range, Size availableSize)
    Parameters
    Type Name Description
    DoubleRange range
    Windows.Foundation.Size availableSize
    Returns
    Type
    System.Double

    CalculateActualRange()

    Declaration
    protected virtual DoubleRange CalculateActualRange()
    Returns
    Type
    DoubleRange

    CalculateNiceInterval(DoubleRange, Size)

    Declaration
    protected virtual double CalculateNiceInterval(DoubleRange actualRange, Size availableSize)
    Parameters
    Type Name Description
    DoubleRange actualRange
    Windows.Foundation.Size availableSize
    Returns
    Type
    System.Double

    CalculateVisibleInterval(DoubleRange, Size)

    Declaration
    protected virtual double CalculateVisibleInterval(DoubleRange visibleRange, Size availableSize)
    Parameters
    Type Name Description
    DoubleRange visibleRange
    Windows.Foundation.Size availableSize
    Returns
    Type
    System.Double

    CalculateVisibleRange(DoubleRange, Size)

    Declaration
    protected virtual DoubleRange CalculateVisibleRange(DoubleRange actualRange, Size availableSize)
    Parameters
    Type Name Description
    DoubleRange actualRange
    Windows.Foundation.Size availableSize
    Returns
    Type
    DoubleRange

    GetActualDesiredIntervalsCount(Size)

    Declaration
    protected double GetActualDesiredIntervalsCount(Size availableSize)
    Parameters
    Type Name Description
    Windows.Foundation.Size availableSize
    Returns
    Type
    System.Double

    GetRenderedRect()

    Gets the actual rect co-ordinates of an ChartAxis.

    Declaration
    public Rect GetRenderedRect()
    Returns
    Type Description
    Windows.Foundation.Rect

    return RectF

    MeasureOverride(Size)

    Declaration
    protected override Size MeasureOverride(Size availableSize)
    Parameters
    Type Name Description
    Windows.Foundation.Size availableSize
    Returns
    Type
    Windows.Foundation.Size

    OnApplyTemplate()

    Declaration
    protected override void OnApplyTemplate()

    OnCreateLabels()

    Using this method, we can adjust the axis labels visible

    Declaration
    protected virtual void OnCreateLabels()

    OnLabelCreated(ChartAxisLabel)

    Declaration
    protected virtual void OnLabelCreated(ChartAxisLabel label)
    Parameters
    Type Name Description
    ChartAxisLabel label

    PointToValue(Double, Double)

    Declaration
    public double PointToValue(double x, double y)
    Parameters
    Type Name Description
    System.Double x
    System.Double y
    Returns
    Type
    System.Double

    ValueToPoint(Double)

    Declaration
    public float ValueToPoint(double value)
    Parameters
    Type Name Description
    System.Double value
    Returns
    Type
    System.Single

    Events

    ActualRangeChanged

    This event occurs when the actual range is changed.

    Declaration
    public event EventHandler<ActualRangeChangedEventArgs> ActualRangeChanged
    Event Type
    Type
    System.EventHandler<ActualRangeChangedEventArgs>
    Remarks

    The ActualRangeChangedEventArgs contains information on the chart axis' minimum and maximum values.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis ActualRangeChanged="OnActualRangeChanged" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis();
    xaxis.ActualRangeChanged += OnActualRangeChanged;
    chart.XAxes.Add(xaxis);
    
    private void OnActualRangeChanged(object sender, ActualRangeChangedEventArgs e)
    {
        var minimumValue = e.ActualMinimum;
        var maximumValue = e.ActualMaximum;
    }

    LabelCreated

    This event occurs when the axis label is created.

    Declaration
    public event EventHandler<ChartAxisLabelEventArgs> LabelCreated
    Event Type
    Type
    System.EventHandler<ChartAxisLabelEventArgs>
    Remarks

    The ChartAxisLabelEventArgs contains the information of AxisLabel.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
        <chart:SfCartesianChart.XAxes>
            <chart:CategoryAxis LabelCreated="OnLabelCreated" />
        </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    CategoryAxis xaxis = new CategoryAxis();
    xaxis.LabelCreated += OnLabelCreated;
    chart.XAxes.Add(xaxis);
    
    private void OnLabelCreated(object sender, ChartAxisLabelEventArgs e)
    {
         // You can customize the content of the axis label.
    }

    PropertyChanged

    Occurs when a property value changes.

    Declaration
    public event PropertyChangedEventHandler PropertyChanged
    Event Type
    Type
    System.ComponentModel.PropertyChangedEventHandler

    Implements

    System.ComponentModel.INotifyPropertyChanged
    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved