Customize-the-DateTime-Category-Axis-in-the-MAUI-Cartesian-Chart

This sample demonstrates how to add and customize DateTime Category axis in the .NET MAUI Cartesian Chart within a .NET MAUI application.

Sample

    <chart:SfCartesianChart Margin="20">

        <chart:SfCartesianChart.Title>
            <Label Text="Stock Performance Visualization" FontSize="18" FontAttributes="Bold"
                   HorizontalTextAlignment="Center"/>
        </chart:SfCartesianChart.Title>

        <chart:SfCartesianChart.XAxes>
            <chart:DateTimeCategoryAxis PlotOffsetStart="5" PlotOffsetEnd="5"
                                        Interval="10" IntervalType="Days">
                <chart:DateTimeCategoryAxis.Title>
                    <chart:ChartAxisTitle Text="Months" FontAttributes="Bold" FontSize="15"/>
                </chart:DateTimeCategoryAxis.Title>

                <chart:DateTimeCategoryAxis.LabelStyle>
                    <chart:ChartAxisLabelStyle LabelFormat="dd MMM"/>
                </chart:DateTimeCategoryAxis.LabelStyle>
            </chart:DateTimeCategoryAxis>
        </chart:SfCartesianChart.XAxes>

        <chart:SfCartesianChart.YAxes>
            <chart:NumericalAxis PlotOffsetStart="5">
                <chart:NumericalAxis.Title>
                    <chart:ChartAxisTitle Text="Stock Price ($)" FontAttributes="Bold"
                                          FontSize="15"/>
                </chart:NumericalAxis.Title>
            </chart:NumericalAxis>
        </chart:SfCartesianChart.YAxes>

        <chart:LineSeries ItemsSource="{Binding StockPrices}" XBindingPath="Date"
                          YBindingPath="Price" ShowMarkers="True"/>

    </chart:SfCartesianChart>

Requirements to run the demo

To run the demo, refer to System Requirements for .NET MAUI

Troubleshooting:

Path too long exception

If you are facing path too long exception when building this example project, close Visual Studio and rename the repository to short and build the project.