How to Optimize FastLine Series Performance in .NET MAUI Chart?

In this article, we discuss effective strategies for optimizing the performance of the FastLine Series in Syncfusion .NET MAUI Cartesian Chart.

Introduction

The FastLine Series in the .NET MAUI Cartesian Chart Control is designed to efficiently display large datasets. However, ensuring optimal performance is crucial for a smooth user experience, especially when working with high-density data points.

Purpose of Optimization

The primary goal of performance optimization is to enhance the chart’s responsiveness and rendering speed, particularly when handling large volumes of data. Optimization minimizes the computational overhead and ensures smooth navigation, panning, and zooming, thereby improving the overall user experience.

Ways to Optimize Performance in Syncfusion MAUI Charts

1. Disable Anti-Aliasing

• Description: Anti-aliasing smooths out jagged edges on lines but can increase rendering time.
• Implementation: Set the EnableAntiAliasing property to false.
• Benefit: Disabling anti-aliasing reduces the rendering overhead, improving performance without significantly compromising visual quality.

[XAML]

<chart:FastLineSeries  
                  ItemsSource="{Binding DataCollection}"
                  XBindingPath="Date"
                  YBindingPath="Value"
                  EnableAntiAliasing="False">
</chart:FastLineSeries> 

[C#]

FastLineSeries series = new FastLineSeries()
{
   ItemsSource = new ViewModel().DataCollection,
   XBindingPath = "Date",
   YBindingPath = "Value",
   EnableAntiAliasing = false 
}; 

2. Reduce Stroke Width

• Description: Thicker lines require more rendering effort.
• Implementation: Reduce the series StrokeWidth property to 1.
• Benefit: Using a thinner line ensures faster rendering while retaining clarity in the chart.

[XAML]

<chart:FastLineSeries 
                 ItemsSource="{Binding DataCollection}"
                 XBindingPath="Date"
                 StrokeWidth="1"
                 YBindingPath="Value">
</chart:FastLineSeries> 

[C#]

FastLineSeries series = new FastLineSeries()
{
   ItemsSource = new ViewModel().DataCollection,
   XBindingPath = "Date",
   YBindingPath = "Value",
   StrokeWidth= 1
}; 

3. Remove Data Labels

• Description: Displaying data labels for each data point can significantly slow down rendering, especially with large datasets.
• Implementation: Avoid using data labels with the FastLine series. Set the ShowDataLabels property to false.
• Benefit: Eliminating data labels speeds up rendering and reduces visual clutter in high-density charts.

[XAML]

<chart:FastLineSeries 
                 ItemsSource="{Binding DataCollection}"
                 XBindingPath="Date"
                 ShowDataLabels="False"
                 YBindingPath="Value">
</chart:FastLineSeries> 

[C#]

FastLineSeries series = new FastLineSeries()
{
   ItemsSource = new ViewModel().DataCollection,
   XBindingPath = "Date",
   YBindingPath = "Value",
   ShowDataLabels = false
}; 

4. Choose the Appropriate Axis

• Description: The choice of axis affects rendering performance. A CategoryAxis processes each label individually, which can be slower compared to NumericalAxis or DateTimeAxis.
• Implementation: Use DateTimeAxis or NumericalAxis based on the data type.
• Benefit: These axes streamline data processing, resulting in faster chart updates.

[XAML]

<chart:SfCartesianChart.XAxes>
   <chart:DateTimeAxis>
   </chart:DateTimeAxis>
</chart:SfCartesianChart.XAxes>

<chart:SfCartesianChart.YAxes>
   <chart:NumericalAxis>
   </chart:NumericalAxis>
</chart:SfCartesianChart.YAxes> 

[C#]

DateTimeAxis primaryAxis = new DateTimeAxis ();
chart.XAxes.Add(primaryAxis); 

NumericalAxis secondaryAxis = new NumericalAxis();
chart.YAxes.Add(secondaryAxis); 

By following these strategies, you can optimize the performance of the FastLine Series in .NET MAUI Cartesian Chart Control. Refer to the following complete code implementation for these optimizations:

[XAML]

<chart:SfCartesianChart x:Name="chart">

   <chart:SfCartesianChart.BindingContext>
       <local:ViewModel x:Name="viewModel"></local:ViewModel>
   </chart:SfCartesianChart.BindingContext>
   
   <chart:SfCartesianChart.XAxes>
       <chart:DateTimeAxis>
       </chart:DateTimeAxis>
   </chart:SfCartesianChart.XAxes>

   <chart:SfCartesianChart.YAxes>
       <chart:NumericalAxis>
       </chart:NumericalAxis>
   </chart:SfCartesianChart.YAxes>


   <!--Initialize the series for chart-->
   <chart:FastLineSeries x:Name="series" 
                         ItemsSource="{Binding DataCollection}"
                         XBindingPath="Date"
                         YBindingPath="Value"
                         EnableAntiAliasing="False"
                         ShowDataLabels="False"
                         StrokeWidth="1">
   </chart:FastLineSeries>

   </chart:SfCartesianChart> 

[C#]

// Create the chart
SfCartesianChart chart = new SfCartesianChart();

// Set the BindingContext
var viewModel = new ViewModel();
chart.BindingContext = viewModel;

// Set up XAxes as DateTimeAxis
var xAxis = new DateTimeAxis();
chart.XAxes.Add(xAxis);

// Set up YAxes as NumericalAxis
var yAxis = new NumericalAxis();
chart.YAxes.Add(yAxis);

// Initialize the FastLineSeries
var fastLineSeries = new FastLineSeries
{
   ItemsSource = viewModel.DataCollection, // Bind the data
   XBindingPath = "Date", // X-axis binding
   YBindingPath = "Value", // Y-axis binding
   EnableAntiAliasing = false, // Disable anti-aliasing
   ShowDataLabels = false, // Disable data labels
   StrokeWidth = 1 // Set stroke width
};

// Add the series to the chart
chart.Series.Add(fastLineSeries); 

Output

Conclusion

I hope you enjoyed learning about how to optimize fastline series performance in .NET MAUI Chart.

Refer to our .NET MAUI Cartesian Chart’s feature tour page to know about its other groundbreaking feature representations. You can also explore our .NET MAUI Chart documentation to understand how to present and manipulate data.
For current customers, you can check out our .NET MAUI components from the License and Downloads page. If you are new to Syncfusion, try our 30-day free trail to check out our .NET MAUI Chart and other .NET MAUI components.
Please let us know in the following comments section if you have any queries or require clarifications. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!