Bubble Series Performance
9 Replies
Thanks for your patience.
Due to technical blocks we were unable to set color for each scatter points.
We would like to suggest the available coloring customization using the FastScatterSeries by using the CustomGradientColors and by providing the GradientStops Offset values for the range as per your requirement as in the below code snippet,
XAML:
|
<chart:SfChart x:Name="chart" HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand">
….
<chart:FastScatterSeries ItemsSource="{Binding Data}"
XBindingPath="XValue"
YBindingPath="YValue"
ScatterWidth="10" ScatterHeight="10"
EnableAntiAliasing="False">
</chart:FastScatterSeries>
<chart:SfChart.ColorModel>
<chart:ChartColorModel Palette="Custom"
CustomGradientColors="{Binding GradientColors}">
</chart:ChartColorModel>
</chart:SfChart.ColorModel>
…
</chart:SfChart> |
C#: [ViewModel.cs]
|
GradientColors = new ChartGradientColorCollection()
{
new ChartGradientColor()
{
StartPoint = new Point(0.5, 1) , EndPoint = new Point(0.5,0),
GradientStops = new ChartGradientStopCollection()
{
new ChartGradientStop(){Offset = 0.30f, Color = Color.Green},
new ChartGradientStop(){Offset = 0.30f, Color = Color.Yellow},
new ChartGradientStop(){Offset = 0.50f, Color = Color.Yellow},
new ChartGradientStop(){Offset = 0.50f, Color = Color.Orange},
new ChartGradientStop(){Offset = 0.65f, Color = Color.Orange},
new ChartGradientStop(){Offset = 0.65f, Color = Color.Red},
}
}
}; |
Screenshot:
Based on the provided image we would like to suggest using multiple FastScatterSeries only incase if it is possible to collect/get the separate set of datapoints for each part in egg and you can set the color as per your requirement for each series and also able to increase the scatter size for any particular series.
In case, if you are working with live data, please refer the below steps to optimize the chart performance:
· We can able to hold the chart from updating of each data added to the collection, using SuspendSeriesNotification and ResumeSeriesNotification methods in chart control, the chart will not respond to any change in the items source collection after the SuspendSeriesNotification method is invoked. It will be updated with latest data after the ResumeSeriesNotification method is invoked.
• Try to remove the data which is not visible in view.
• Try adding bulk data instead of adding single data points with some delay.
· Try to update the collection in background thread instead of updating in UI main thread.
· Use DateTimeAxis and NumericalAxis instead of CategoryAxis.
· Set the StrokeWidth of FastLineSeries to 1 by default its value is 2.
· Set the EnableAntiAliasing property as false for FastLineSeries, FastScatterSeries.
C#:
|
public class ViewModel
{
….
public Action BeginDataUpdate;
public Action EndDataUpdate;
}
public partial class MainPage : ContentPage
{
ViewModel viewModel;
….
public MainPage()
{
InitializeComponent();
viewModel = new ViewModel();
this.BindingContext = viewModel;
viewModel.BeginDataUpdate = () => chart.SuspendSeriesNotification();
viewModel.EndDataUpdate = () => chart.ResumeSeriesNotification();
}
….
public async void LoadData()
{
await Task.Delay(500);
//dynamic change data using suspend and resume
Device.BeginInvokeOnMainThread(() =>
{
//chart.SuspendSeriesNotification() is called when using below code.
viewModel.BeginDataUpdate();
for (int i = 0; k < 128; k++)
{
//Add Data
}
//chart.ResumeSeriesNotification() is called when using below code.
viewModel.EndDataUpdate();
});
….
}
} |
Please let us know whether the above suggestion helps for your requirement or not.
Regards,
Devakumar D
SIGN IN To post a reply.
