Infragistics logo
메뉴
.NET and JavaScript UI Controls
Version

Polar Spline Series

This topic explains, with code examples, how to use Polar Spline Series in the XamDataChart™ control.

Introduction

Polar Spline Series is rendered using a collection of spline lines connecting data points in polar (angle/radius) coordinate system. The PolarSplineSeries uses the same concepts of data plotting as the ScatterSplineSeries but wraps data points around a circle rather than stretching them along a horizontal line. Like with other series types, multiple PolarSplineSeries can be plotted in the same data chart and they can be overlaid on each other to show differences and similarities between data sets. For more information on this group of series, refer to the Polar Series topic.

Preview

Figure 1 demonstrates what Polar Spline Series looks like when plotted in the XamDataChart control.

xamDataChart Polar Spline Series 01.png

Figure 1: Sample implementation of a PolarSplineSeries

Data Binding

The code snippet below shows how to bind sample polar data (which is available for download from the Sample Polar Data resource) to the PolarSplineSeries. The example assumes that you have already configured your project for the XamDataChart control.

In XAML:

xmlns:local="clr-namespace:Infragistics.Models;assembly=YourAppName"
...
<ig:XamDataChart x:Name="DataChart" >
    <ig:XamDataChart.Resources>
        <local:PolarDataSource x:Key="data" />
    </ig:XamDataChart.Resources>
    <ig:XamDataChart.Axes>
        <ig:NumericAngleAxis  x:Name="AngleAxis"  MinimumValue="0" MaximumValue="360" Interval="30"/>
        <ig:NumericRadiusAxis x:Name="RadiusAxis" MinimumValue="0" MaximumValue="100" Interval="20"/>
    </ig:XamDataChart.Axes>
    <ig:XamDataChart.Series>
        <ig:PolarSplineSeries AngleAxis="{Binding ElementName=AngleAxis}"
                            RadiusAxis="{Binding ElementName=RadiusAxis}"
                            AngleMemberPath="Angle"
                            RadiusMemberPath="Radius"
                            ItemsSource="{StaticResource data}"
                            Thickness="5"
                            MarkerType="None"
                            Brush="#7F58A6C7">
        </ig:PolarSplineSeries>
    </ig:XamDataChart.Series>
</ig:XamDataChart>

In C#:

var data = new PolarDataSource();
var AngleAxis = new NumericYAxis();
var RadiusAxis = new CategoryXAxis();

var series = new PolarSplineSeries();
series.ItemsSource = data;
series.AngleMemberPath = "Angle";
series.RadiusMemberPath = "Radius";
series.AngleAxis = AngleAxis;
series.RadiusAxis = RadiusAxis;

var chart = new XamDataChart();
chart.Axes.Add(AngleAxis);
chart.Axes.Add(RadiusAxis);
chart.Series.Add(series);

In Visual Basic:

Dim data As New PolarDataSource()
Dim AngleAxis As New NumericAngleAxis()
Dim RadiusAxis As New NumericRadiusAxis()

Dim series As New PolarSplineSeries()
series.ItemsSource = polarDataSample
series.AngleMemberPath = "Angle"
series.RadiusMemberPath = "Radius"
series.AngleAxis = AngleAxis
series.RadiusAxis = RadiusAxis;

Dim chart As New XamDataChart()
chart.Axes.Add(AngleAxis)
chart.Axes.Add(RadiusAxis)
chart.Series.Add(series)

Related Content