How to change the size and color of the scatter series?

1 min read

Description:

The ScatterSeries plots an ellipse for each datapoint with a definite size and fill. You may want to have variance in its size and color, especially when you have more than one series. This article describes the way to change the size and color of the ScatterSeries.

Solution:

The SfChart provides the direct APIs ScatterHeight and ScatterWidth for customizing the height and width of the ScatterSeries. These values are pixel values and the default value for both the properties is 20d. The Interior property is used to fill the ellipse as in the other series. These properties are also open for FastScatterBitmapSeries that can be used for high performance requirement. Here, the ScatterSeries is used.

XAML

<chart:ScatterSeries ScatterWidth="45" ScatterHeight="25" Interior="DarkRed" XBindingPath="Year" YBindingPath="StandardRoom" ItemsSource="{Binding}"/>         
<chart:ScatterSeries ScatterWidth="25" ScatterHeight="45" Interior="Red" XBindingPath="Year" YBindingPath="DoubleRoom" ItemsSource="{Binding}"/>
<chart:ScatterSeries ScatterWidth="45" ScatterHeight="45"  Interior="Blue" XBindingPath="Year" YBindingPath="ExecutiveRoom" ItemsSource="{Binding}"/>

(this.scatterChart.Series[0] as ScatterSeries).ScatterWidth = 45;
(this.scatterChart.Series[0] as ScatterSeries).ScatterHeight = 25;
(this.scatterChart.Series[1] as ScatterSeries).ScatterWidth = 25;
(this.scatterChart.Series[1] as ScatterSeries).ScatterHeight = 45;
(this.scatterChart.Series[2] as ScatterSeries).ScatterWidth = 45;
(this.scatterChart.Series[2] as ScatterSeries).ScatterHeight = 45;

The following screenshot displays the ScatterSeries with custom size and fill:

$C:\Users\sureshs\Desktop\sshot-32.png$

Did you find this information helpful?

Yes

Comments (0)

How to change the size and color of the scatter series?

Access denied