Scatter Spline Series
Send Feedback

Glossary Item Box

Topic Overview


This topic provides a conceptual overview of the Scatter Spline Series in the IGChartView™ control and uses a code example to demonstrate how to add it to the chart view.

In this topic


Scatter Spline Series summary

Scatter Spline series is a Scatter Series with its data points sequentially joined by a spline, and used either to show the relationship among items in several distinct series of data or to plot a spline-using x and y coordinates. The x and y coordinates of the data marker are determined by two data values. A Scatter Spline series draws attention to uneven intervals in data. This type of series is often used to plot scientific data, and can highlight the deviation of collected data from predicted results. You may also use a Scatter Spline series to organize data chronologically.

A chart with Scatter Spline series, displays data as a collection of points connected with spline, with each point having the value of one variable determining its position on the horizontal axis and the value of the other variable determining its position on the vertical axis.

Data requirements

While the IGChartView control allows easy binding to your own data model, make sure to supply the appropriate amounts and types of data required by the series. Failing to do so causes the IGChartView to appear blank.

Required – the data model must contain two numeric fields representing the x and y values for each point on the chart to render the data.

Adding a Scatter Spline Series to the IGChartView – Code Example


The code below uses the IGScatterSeriesDataSourceHelper to supply randomly generated data to a Scatter Spline Series by first adding to the IGChartView instance, and then adding the IGChartView as a subview of the current UIView.


This code example requires the inclusion of the IGChartView framework, detail about how to add this framework can be found in the Adding the Chart Framework File topic.


In C#:

NSMutableArray x = new NSMutableArray();
for (int i = 0; i < 50; i++) {
      x.Add(new NSNumber((new Random(DateTime.Now.Millisecond).Next() % 100)));
NSMutableArray y = new NSMutableArray();
for (int i = 0; i < 50; i++) {
      y.Add(new NSNumber((new Random(DateTime.Now.Millisecond).Next() % 100)));
IGScatterSeriesDataSourceHelper source = new IGScatterSeriesDataSourceHelper();
source.XValues = x;
source.YValues = y;
IGChartView infraChart = new IGChartView(this.View.Frame);
IGNumericXAxis xAxis = new IGNumericXAxis("xAxis");
IGNumericYAxis yAxis = new IGNumericYAxis("yAxis");
IGScatterSplineSeries scatterSeries = new IGScatterSplineSeries("scatterSeries");
scatterSeries.XAxis = xAxis;
scatterSeries.YAxis = yAxis;
scatterSeries.DataSource = source;

In Objective-C:

    NSMutableArray *x = [[NSMutableArray alloc] init];
    for (int i = 0; i < 50; i++) {
        [x addObject:[[NSNumber alloc] initWithDouble:(arc4random() % 100)]];
    NSMutableArray *y = [[NSMutableArray alloc] init];
    for (int i = 0; i < 50; i++) {
        [y addObject:[[NSNumber alloc] initWithDouble:(arc4random() % 100)]];
    IGScatterSeriesDataSourceHelper *source = [[IGScatterSeriesDataSourceHelper alloc] init];
    source.xValues = x;
    source.yValues = y;
    IGChartView *infraChart = [[IGChartView alloc] initWithFrame:self.view.frame];
    IGNumericXAxis *xAxis = [[IGNumericXAxis alloc] initWithKey:@"xAxis"];
    IGNumericYAxis *yAxis = [[IGNumericYAxis alloc] initWithKey:@"yAxis"];
    [infraChart addAxis:xAxis];
    [infraChart addAxis:yAxis];
    IGScatterSplineSeries *scatterSeries = [[IGScatterSplineSeries alloc] initWithKey:@"scatterSeries"];
    scatterSeries.xAxis = xAxis;
    scatterSeries.yAxis = yAxis;
    scatterSeries.dataSource = source;
    [infraChart addSeries:scatterSeries];
    [self.view addSubview:infraChart];

Related Content


The following topics provide additional information related to this topic.



This collection of topics explains each of the individual charts supported by the IGChartView control.