Customize.md

layout	title	description	platform	control	documentation
post	Customize data points	How to customize data points in Essential Xamarin.Forms Sparkline	xamarin	Sparkline	ug

Customize data points

Color of the first, last, high, low and negative data points can be customized using the following properties.

• FirstPointColor - used to change the first point color of the sparkline.
• LastPointColor - used to change the last point color of the sparkline.
• HighPointColor - used to change the high point color of the sparkline.
• LowPointColor - used to change the low point color of the sparkline.
• NegativePointsColor - used to change the negative point color of the sparkline.

N> NegativePointsColor is applicable for SfColumnSparkline and SfWinLossSparkline alone.

Code snippet to customize the markers

{% tabs %}

{% highlight xaml %}

<sparkline:SfLineSparkline ItemsSource = "{Binding Data}" YBindingPath = "Performance" FirstPointColor="Green" LastPointColor="Blue" HighPointColor="Purple" LowPointColor="Red">
sparkline:SfLineSparkline.Marker <sparkline:MarkerBase IsVisible="True" Width= "15" Height= "15"/> </sparkline:SfLineSparkline.Marker> </sparkline:SfLineSparkline>

{% endhighlight %}

{% highlight c# %}

SfLineSparkline lineSparkline = new SfLineSparkline() { YBindingPath = "Performance", ItemsSource = viewModel.Data, Marker = new MarkerBase() { IsVisible = true, Width = 15, Height = 15 },

FirstPointColor = Color.Green,
LastPointColor = Color.Blue,
HighPointColor = Color.Purple,
LowPointColor = Color.Red

};

{% endhighlight %}

{% endtabs %}

Code snippet to customize the segments

{% tabs %}

{% highlight xaml %}

<sparkline:SfColumnSparkline ItemsSource="{Binding Data}" YBindingPath="Performance" FirstPointColor="Green" LastPointColor="Purple" HighPointColor="Maroon" LowPointColor="Blue" NegativePointsColor="Red">

</sparkline:SfColumnSparkline>

{% endhighlight %}

{% highlight c# %}

SfColumnSparkline columnSparkline = new SfColumnSparkline() { YBindingPath = "Performance", ItemsSource = viewModel.Data, FirstPointColor = Color.Green, LastPointColor = Color.Purple, HighPointColor = Color.Maroon, LowPointColor = Color.Blue, NegativePointsColor = Color.Red };

{% endhighlight %}

{% endtabs %}