Quick Start Guide

Adding a Series

Now you have your chart it’s time to add some data. Adding data to a ShinobiChart is as simple as creating a DataAdapter, adding data to it and handing it to a series on the chart. For this app you’ll have 2 series, each with its own data adapter. Still inside the if statement add:

SimpleDataAdapter dataAdapter1 = new SimpleDataAdapter();
SimpleDataAdapter dataAdapter2 = new SimpleDataAdapter();

This creates a new SimpleDataAdapter - it notifies the chart every time a data point/set of data points is added or removed, and is supplied out the box.

Now, add some data to it - sine waves:

for (int i = 0; i < 100; i++) {
    double radians = i * Math.PI / 25.0;
    dataAdapter1.Add(new DataPoint(radians, Math.Sin(radians)));
    dataAdapter2.Add(new DataPoint(radians, Math.Cos(radians)));
}

A DataPoint has an X and a Y value. Like SimpleDataAdapter it’s supplied out the box for when you just need a simple data point representation. You can instead create your own data points by implementing the Data interface.

Important note: In the Java implementation of shinobicharts, which is wrapped by the Xamarin bindings in Com.ShinobiControls.Charts.dll, DataAdapter and DataPoint are parametrized classes. Owing to the way that Java parametrization works, this doesn't come through the JNI layer on which the bindings are built, and these classes deal in Java.Lang.Object. Happily, the binding layer will silently convert whatever it can to the Xamarin binding or Java.Lang.Object - here it's doing String and double. It can't convert DateTime, but the shinobicharts API includes a DateUtils class to perform these conversions.

Here you are using double, but the types should be appropriate for their intended axes. NumberAxis is compatible with any numeric data which is convertible to java.lang.Number, and will accept Data objects using those types.

Next, create two line series and give the data adapters to them. Finally, give them to the chart.

LineSeries series1 = new LineSeries();
series1.DataAdapter = dataAdapter1;
shinobiChart.AddSeries(series1);

LineSeries series2 = new LineSeries();
series2.DataAdapter = dataAdapter2;
shinobiChart.AddSeries(series2);

Excellent, you now have your first ShinobiChart complete with data. But don’t go anywhere just yet, you still need to style the chart a bit to make it a little bit more exciting.

Tip: Some devices have to be told that the application requires hardware acceleration in order to display a chart. Simply add android:hardwareAccelerated="true" to the application element of the AndroidManifest.xml file in the ShinobiQuickStart project.


<< Previous: Draw a Simple Chart | Next: Basic Styling >>