ScatterLineSeries
This series is visualized on the screen as a straight line connecting all data points. As all scatter series, this one also requires the RadCartesianChart to define two LinearAxis as vertical and horizontal axis.
Declaratively defined series
You can use the following definition to display a simple ScatterLineSeries
Example 1: Declaring a ScatterLineSeries in XAML
<telerik:RadCartesianChart Palette="Windows8">
<telerik:RadCartesianChart.HorizontalAxis>
<telerik:LinearAxis/>
</telerik:RadCartesianChart.HorizontalAxis>
<telerik:RadCartesianChart.VerticalAxis>
<telerik:LinearAxis />
</telerik:RadCartesianChart.VerticalAxis>
<telerik:RadCartesianChart.Series>
<telerik:ScatterLineSeries>
<telerik:ScatterLineSeries.DataPoints>
<telerik:ScatterDataPoint XValue="0" YValue="2" />
<telerik:ScatterDataPoint XValue="1" YValue="5" />
<telerik:ScatterDataPoint XValue="2" YValue="3" />
<telerik:ScatterDataPoint XValue="3" YValue="10" />
<telerik:ScatterDataPoint XValue="4" YValue="9" />
<telerik:ScatterDataPoint XValue="5" YValue="7" />
<telerik:ScatterDataPoint XValue="6" YValue="1" />
</telerik:ScatterLineSeries.DataPoints>
</telerik:ScatterLineSeries>
</telerik:RadCartesianChart.Series>
</telerik:RadCartesianChart>
Figure 1: ScatterLineSeries visual appearance
Properties
- YValueBinding: A property of type DataPointBinding that gets or sets the property path that determines the Y value of the data point.
- XValueBinding: A property of type DataPointBinding that gets or sets the property path that determines the X value of the data point.
- DashArray: A property of type DoubleCollection that gets or sets the dash pattern applied to the scatter line series itself.
- Stroke: A property of type Brush that gets or sets the stroke of the scatter line series.
- StrokeShapeStyle: A property of type Style that gets or sets the style of the stroke of the scatter line series. The property accepts a style that targets an object of type Path.
Data Binding
You can use the YValueBinding and XValueBinding properties of the ScatterLineSeries to bind the DataPoints’ properties to the properties from your view models.
Example 2: Defining the view model
public class PlotInfo
{
public double XValue { get; set; }
public double YValue { get; set; }
}
//.......
this.DataContext = new ObservableCollection<PlotInfo>
{
new PlotInfo() { XValue = 0, YValue = 2},
//....
};
Example 3: Specify a ScatterLineSeries in XAML
<telerik:ScatterLineSeries ItemsSource="{Binding}" YValueBinding="YValue" XValueBinding="XValue"/>
See the Create Data-Bound Chart for more information on data binding in the RadChartView suite.
Styling the Series
You can see how to style the scatter line series using different properties in the ScatterLineSeries section of the Customizing CartesianChart Series help article.
Additionally, you can use the Palette property of the chart to change the colors of the ScatterLineSeries on a global scale. You can find more information about this feature in the Palettes section in our help documentation.