MAUI

User Guide Demos Support Forums Download
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class DateTimeAxis

    Show / Hide Table of Contents

    Class DateTimeAxis

    DateTimeAxis is used to plot DateTime values. The date-time axis uses date time scale and displays date-time values as axis labels in the specified format.

    Inheritance
    System.Object
    ChartAxis
    RangeAxisBase
    DateTimeAxis
    Inherited Members
    RangeAxisBase.MinorTicksPerIntervalProperty
    RangeAxisBase.EdgeLabelsVisibilityModeProperty
    RangeAxisBase.MinorGridLineStyleProperty
    RangeAxisBase.MinorTickStyleProperty
    RangeAxisBase.ShowMinorGridLinesProperty
    RangeAxisBase.OnBindingContextChanged()
    RangeAxisBase.EdgeLabelsVisibilityMode
    RangeAxisBase.MinorTicksPerInterval
    RangeAxisBase.MinorGridLineStyle
    RangeAxisBase.MinorTickStyle
    RangeAxisBase.ShowMinorGridLines
    ChartAxis.IsVisibleProperty
    ChartAxis.AxisLineOffsetProperty
    ChartAxis.LabelRotationProperty
    ChartAxis.LabelStyleProperty
    ChartAxis.AxisLineStyleProperty
    ChartAxis.CrossesAtProperty
    ChartAxis.RenderNextToCrossingValueProperty
    ChartAxis.CrossAxisNameProperty
    ChartAxis.TitleProperty
    ChartAxis.IsInversedProperty
    ChartAxis.EdgeLabelsDrawingModeProperty
    ChartAxis.MajorGridLineStyleProperty
    ChartAxis.MajorTickStyleProperty
    ChartAxis.ZoomPositionProperty
    ChartAxis.ZoomFactorProperty
    ChartAxis.ShowMajorGridLinesProperty
    ChartAxis.NameProperty
    ChartAxis.PlotOffsetStartProperty
    ChartAxis.PlotOffsetEndProperty
    ChartAxis.EnableAutoIntervalOnZoomingProperty
    ChartAxis.ShowTrackballLabelProperty
    ChartAxis.TrackballLabelStyleProperty
    ChartAxis.ValueToPoint(Double)
    ChartAxis.PointToValue(Double, Double)
    ChartAxis.GetActualDesiredIntervalsCount(Size)
    ChartAxis.OnLabelCreated(ChartAxisLabel)
    ChartAxis.CalculateVisibleInterval(DoubleRange, Size)
    ChartAxis.ComputeDesiredSize(Size)
    ChartAxis.DrawAxis(ICanvas, Rect)
    ChartAxis.DrawMajorTick(ICanvas, Double, PointF, PointF)
    ChartAxis.DrawMinorTick(ICanvas, Double, PointF, PointF)
    ChartAxis.DrawAxisLine(ICanvas, Single, Single, Single, Single)
    ChartAxis.DrawGridLine(ICanvas, Double, Single, Single, Single, Single)
    ChartAxis.IsVisible
    ChartAxis.PlotOffsetStart
    ChartAxis.PlotOffsetEnd
    ChartAxis.AxisLineOffset
    ChartAxis.LabelRotation
    ChartAxis.LabelStyle
    ChartAxis.AxisLineStyle
    ChartAxis.CrossesAt
    ChartAxis.RenderNextToCrossingValue
    ChartAxis.CrossAxisName
    ChartAxis.Title
    ChartAxis.IsInversed
    ChartAxis.EdgeLabelsDrawingMode
    ChartAxis.MajorGridLineStyle
    ChartAxis.MajorTickStyle
    ChartAxis.ZoomPosition
    ChartAxis.ZoomFactor
    ChartAxis.ShowMajorGridLines
    ChartAxis.EnableAutoIntervalOnZooming
    ChartAxis.ShowTrackballLabel
    ChartAxis.TrackballLabelStyle
    ChartAxis.Name
    ChartAxis.LabelCreated
    ChartAxis.ActualRangeChanged
    Namespace: Syncfusion.Maui.Charts
    Assembly: Syncfusion.Maui.Charts.dll
    Syntax
    public class DateTimeAxis : RangeAxisBase
    Remarks

    To render an axis, the datetime axis instance to be added in chart’s XAxes collection as per the following code snippet.

    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:DateTimeAxis/>
            </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    DateTimeAxis xaxis = new DateTimeAxis();
    chart.XAxes.Add(xaxis);	

    Title - To render the title, refer to this Title property.

    Grid Lines - To show and customize the grid lines refer these ShowMajorGridLines, and MajorGridLineStyle, ShowMinorGridLines, MinorTicksPerInterval, MinorGridLineStyle properties.

    Tick Lines - To show and customize the tick lines refer these MajorTickStyle, MinorTickStyle, MinorTicksPerInterval properties.

    Axis Line - To customize the axis line using the AxisLineStyle property.

    Range Customization - To customize the axis range with help of the Minimum, and Maximum properties.

    Labels Customization - To customize the axis labels, refer to this LabelStyle property.

    Inversed Axis - Inverse the axis using the IsInversed property.

    Axis Crossing - For axis crossing, refer these CrossesAt, CrossAxisName, and RenderNextToCrossingValue properties.

    Interval - To define the axis labels interval using the Interval, and IntervalType properties.

    Constructors

    DateTimeAxis()

    Declaration
    public DateTimeAxis()

    Fields

    IntervalProperty

    Declaration
    public static readonly BindableProperty IntervalProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    IntervalTypeProperty

    Declaration
    public static readonly BindableProperty IntervalTypeProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    MaximumProperty

    Declaration
    public static readonly BindableProperty MaximumProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    MinimumProperty

    Declaration
    public static readonly BindableProperty MinimumProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    RangePaddingProperty

    Declaration
    public static readonly BindableProperty RangePaddingProperty
    Field Value
    Type Description
    Microsoft.Maui.Controls.BindableProperty

    Properties

    ActualMaximum

    Gets the actual maximum value of the DateTimeAxis.

    Declaration
    public DateTime ActualMaximum { get; }
    Property Value
    Type Description
    System.DateTime
    Examples
    • MainWindow.xaml
    • MainWindow.cs
      <VerticalStackLayout>
        <Label Text="{Binding Source={x:Reference xAxis}, Path=ActualMaximum }" />
        <chart:SfCartesianChart>
    
              <chart:SfCartesianChart.XAxes>
                  <chart:DateTimeAxis x:Name="xAxis"/>
              </chart:SfCartesianChart.XAxes>
    
              <chart:SfCartesianChart.YAxes>
                  <chart:NumericalAxis x:Name="yAxis"/>
              </chart:SfCartesianChart.YAxes>
    
              <chart:SfCartesianChart.Series>
                  <chart:ColumnSeries ItemsSource="{Binding Data}"
                                      XBindingPath="XValue"
                                      YBindingPath="YValue" />
              </chart:SfCartesianChart.Series>
    
        </chart:SfCartesianChart>
      </VerticalStackLayout>
        SfCartesianChart chart = new SfCartesianChart();
    
        DateTimeAxis xAxis = new DateTimeAxis();
        NumericalAxis yAxis = new NumericalAxis();
    
        chart.XAxes.Add(xAxis);
        chart.YAxes.Add(yAxis);
    
        ColumnSeries series = new ColumnSeries();
        series.ItemsSource = viewmodel.Data;
        series.XBindingPath = "XValue";
        series.YBindingPath = "YValue";
        chart.Series.Add(series);
    
        Label label = new Label();
        label.SetBinding(Label.TextProperty, new Binding("ActualMaximum", source: xAxis));

    ActualMinimum

    Gets the actual minimum value of the DateTimeAxis.

    Declaration
    public DateTime ActualMinimum { get; }
    Property Value
    Type Description
    System.DateTime
    Examples
    • MainWindow.xaml
    • MainWindow.cs
      <VerticalStackLayout>
        <Label Text="{Binding Source={x:Reference xAxis}, Path=ActualMinimum }" />
        <chart:SfCartesianChart>
    
              <chart:SfCartesianChart.XAxes>
                  <chart:DateTimeAxis x:Name="xAxis"/>
              </chart:SfCartesianChart.XAxes>
    
              <chart:SfCartesianChart.YAxes>
                  <chart:NumericalAxis x:Name="yAxis"/>
              </chart:SfCartesianChart.YAxes>
    
              <chart:SfCartesianChart.Series>
                  <chart:ColumnSeries ItemsSource="{Binding Data}"
                                      XBindingPath="XValue"
                                      YBindingPath="YValue" />
              </chart:SfCartesianChart.Series>
    
        </chart:SfCartesianChart>
      </VerticalStackLayout>
        SfCartesianChart chart = new SfCartesianChart();
    
        DateTimeAxis xAxis = new DateTimeAxis();
        NumericalAxis yAxis = new NumericalAxis();
    
        chart.XAxes.Add(xAxis);
        chart.YAxes.Add(yAxis);
    
        ColumnSeries series = new ColumnSeries();
        series.ItemsSource = viewmodel.Data;
        series.XBindingPath = "XValue";
        series.YBindingPath = "YValue";
        chart.Series.Add(series);
    
        Label label = new Label();
        label.SetBinding(Label.TextProperty, new Binding("ActualMinimum", source: xAxis));

    Interval

    Gets or sets a value that can be used to change the interval between labels.

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

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

    Remarks

    If this property is not set, the interval will be calculated automatically.

    By default, the interval will be calculated based on the minimum and maximum values of the provided data.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:DateTimeAxis Interval="6" IntervalType="Months" />
            </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    DateTimeAxis xaxis = new DateTimeAxis()
    {
       Interval = 6, 
       IntervalType = DateTimeIntervalType.Months
    };
    chart.XAxes.Add(xaxis);

    IntervalType

    Gets or sets the date time unit of the value specified in the Interval property.

    Declaration
    public DateTimeIntervalType IntervalType { get; set; }
    Property Value
    Type Description
    DateTimeIntervalType

    It accepts the DateTimeIntervalType value and its default value is Auto.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:DateTimeAxis IntervalType="Months"/>
            </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    DateTimeAxis xaxis = new DateTimeAxis()
    {
        IntervalType = DateTimeIntervalType.Months
    };
    chart.XAxes.Add(xaxis);

    Maximum

    Gets or sets the maximum value of the time period to be displayed on the chart axis.

    Declaration
    public Nullable<DateTime> Maximum { get; set; }
    Property Value
    Type Description
    System.Nullable<System.DateTime>

    It accepts DateTime values and the default value is null.

    Remarks

    If we didn't set the maximum value, it will be calculated from the underlying collection.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:DateTimeAxis Minimum="2021/05/10" Maximum="2021/11/01"/>
            </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    DateTimeAxis xaxis = new DateTimeAxis()
    {
        Minimum = new DateTime(2021,05,10),
        Maximum = new DateTime(2021,11,01),
    };
    chart.XAxes.Add(xaxis);	

    Minimum

    Gets or sets the minimum value of the time period to be displayed on the chart axis.

    Declaration
    public Nullable<DateTime> Minimum { get; set; }
    Property Value
    Type Description
    System.Nullable<System.DateTime>

    It accepts DateTime values and the default value is null.

    Remarks

    If we didn't set the minimum value, it will be calculated from the underlying collection.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:DateTimeAxis Minimum="2021/05/10" Maximum="2021/11/01"/>
            </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    DateTimeAxis xaxis = new DateTimeAxis()
    {
        Minimum = new DateTime(2021,05,10),
        Maximum = new DateTime(2021,11,01),
    };
    chart.XAxes.Add(xaxis);	

    RangePadding

    Gets or sets a padding type for the date time axis range.

    Declaration
    public DateTimeRangePadding RangePadding { get; set; }
    Property Value
    Type Description
    DateTimeRangePadding

    It acceps the DateTimeRangePadding value and its default value is Auto.

    Examples
    • MainPage.xaml
    • MainPage.xaml.cs
    <chart:SfCartesianChart>
    
            <chart:SfCartesianChart.XAxes>
                <chart:DateTimeAxis RangePadding ="Round" />
            </chart:SfCartesianChart.XAxes>
    
    </chart:SfCartesianChart>
    SfCartesianChart chart = new SfCartesianChart();
    
    DateTimeAxis xaxis = new DateTimeAxis()
    {
        RangePadding = DateTimeRangePadding.Round,
    };
    chart.XAxes.Add(xaxis);

    Methods

    ApplyRangePadding(DoubleRange, Double)

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

    CalculateActualInterval(DoubleRange, Size)

    Declaration
    protected override double CalculateActualInterval(DoubleRange range, Size availableSize)
    Parameters
    Type Name Description
    DoubleRange range
    Microsoft.Maui.Graphics.Size availableSize
    Returns
    Type Description
    System.Double
    Overrides
    ChartAxis.CalculateActualInterval(DoubleRange, Size)

    CalculateActualRange()

    Declaration
    protected override DoubleRange CalculateActualRange()
    Returns
    Type Description
    DoubleRange
    Overrides
    ChartAxis.CalculateActualRange()

    CalculateNiceInterval(DoubleRange, Size)

    Declaration
    protected override double CalculateNiceInterval(DoubleRange actualRange, Size availableSize)
    Parameters
    Type Name Description
    DoubleRange actualRange
    Microsoft.Maui.Graphics.Size availableSize
    Returns
    Type Description
    System.Double
    Overrides
    ChartAxis.CalculateNiceInterval(DoubleRange, Size)

    CalculateVisibleRange(DoubleRange, Size)

    Declaration
    protected override DoubleRange CalculateVisibleRange(DoubleRange range, Size availableSize)
    Parameters
    Type Name Description
    DoubleRange range
    Microsoft.Maui.Graphics.Size availableSize
    Returns
    Type Description
    DoubleRange
    Overrides
    ChartAxis.CalculateVisibleRange(DoubleRange, Size)
    Back to top Generated by DocFX
    Copyright © 2001 - 2023 Syncfusion Inc. All Rights Reserved