SciChart® the market leader in Fast WPF Charts, WPF 3D Charts, iOS Chart, Android Chart and JavaScript Chart Components
Please note! These examples are new to SciChart Mobile v3 release! SciChart iOS & Android ship with Xamarin.iOS and Xamarin.Android bindings around our native iOS & Android Chart controls, allowing you to create fast & feature rich charts to your Xamarin applications. We include ~90 native iOS examples and 90 Android examples, but now also ~60 Xamarin Chart Examples to help you get started with SciChart. You can download the source for our Xamarin Chart Examples from Github, or browse the source code below.
This example demonstrates how to create a simple Band Chart with Xamarin to use it in your iOS and Android app.
The FastBandRenderableSeries in Android and
SCIBandRenderableSeries in iOS draws two lines, denoted by Y1 and Y2, and an optional fill between the lines.
The Filled area changes color depending on whether Y1 is above Y2 or not. The Band Series can be used to display:
Warnings, such as when a value is above a threshold.
The data is provided by XyyDataSeries in both iOS native and Android native.
Documentation Links
The C#/Xamarin.iOS/Xamarin.Android source code for the Xamarin Band Chart example is included below (Scroll down!).
Did you know you can also view the source code from one of the following sources as well?
using Xamarin.Examples.Demo.Data;
using SciChart.iOS.Charting;
namespace Xamarin.Examples.Demo.iOS
{
[ExampleDefinition("Band Chart", "Generates a simple Band series chart in code", icon: ExampleIcon.BandChart)]
public class BandChartViewController : SingleChartViewController<SCIChartSurface>
{
protected override void InitExample()
{
var data0 = DataManager.Instance.GetDampedSinewave(1.0, 0.01, 1000);
var data1 = DataManager.Instance.GetDampedSinewave(1.0, 0.005, 1000, 12);
var dataSeries = new XyyDataSeries<double, double>();
dataSeries.Append(data0.XData, data0.YData, data1.YData);
var xAxis = new SCINumericAxis { VisibleRange = new SCIDoubleRange(1.1, 2.7) };
var yAxis = new SCINumericAxis { GrowBy = new SCIDoubleRange(0.1, 0.1) };
var rSeries = new SCIFastBandRenderableSeries
{
DataSeries = dataSeries,
StrokeStyle = new SCISolidPenStyle(0xFFFF1919, 0.7f),
StrokeY1Style = new SCISolidPenStyle(0xFF279B27, 0.7f),
FillBrushStyle = new SCISolidBrushStyle(0x33279B27),
FillY1BrushStyle = new SCISolidBrushStyle(0x33FF1919)
};
using (Surface.SuspendUpdates())
{
Surface.XAxes.Add(xAxis);
Surface.YAxes.Add(yAxis);
Surface.RenderableSeries.Add(rSeries);
Surface.ChartModifiers.Add(CreateDefaultModifiers());
SCIAnimations.ScaleSeries(rSeries, 3, new SCIElasticEase());
}
}
}
}
using Android.Views.Animations;
using SciChart.Charting.Model;
using SciChart.Charting.Model.DataSeries;
using SciChart.Charting.Modifiers;
using SciChart.Charting.Visuals;
using SciChart.Charting.Visuals.Animations;
using SciChart.Charting.Visuals.Axes;
using SciChart.Charting.Visuals.RenderableSeries;
using SciChart.Data.Model;
using SciChart.Drawing.Common;
using Xamarin.Examples.Demo.Data;
using Xamarin.Examples.Demo;
using Xamarin.Examples.Demo.Droid.Extensions;
using Xamarin.Examples.Demo.Droid.Fragments.Base;
namespace Xamarin.Examples.Demo.Droid.Fragments.Examples
{
[ExampleDefinition("Band Chart", description: "Creates a Band Series Chart", icon: ExampleIcon.BandChart)]
public class BandChartFragment : ExampleBaseFragment
{
public override int ExampleLayoutId => Resource.Layout.Example_Single_Chart_Fragment;
private SciChartSurface Surface => View.FindViewById<SciChartSurface>(Resource.Id.chart);
protected override void InitExample()
{
var xAxis = new NumericAxis(Activity) { VisibleRange = new DoubleRange(1.1, 2.7) };
var yAxis = new NumericAxis(Activity) { GrowBy = new DoubleRange(0.1, 0.1) };
var data = DataManager.Instance.GetDampedSinewave(1.0, 0.01, 1000);
var moreData = DataManager.Instance.GetDampedSinewave(1.0, 0.005, 1000, 12);
var dataSeries = new XyyDataSeries<double, double>();
dataSeries.Append(data.XData, data.YData, moreData.YData);
var rSeries = new FastBandRenderableSeries
{
DataSeries = dataSeries,
StrokeStyle = new SolidPenStyle(0xFFFF1919, 1f.ToDip(Activity)),
StrokeY1Style = new SolidPenStyle(0xFF279B27, 1f.ToDip(Activity)),
FillBrushStyle = new SolidBrushStyle(0x33279B27),
FillY1BrushStyle = new SolidBrushStyle(0x33FF1919)
};
using (Surface.SuspendUpdates())
{
Surface.XAxes.Add(xAxis);
Surface.YAxes.Add(yAxis);
Surface.RenderableSeries.Add(rSeries);
Surface.ChartModifiers = new ChartModifierCollection
{
new ZoomPanModifier(),
new PinchZoomModifier(),
new ZoomExtentsModifier(),
};
new ScaleAnimatorBuilder(rSeries) { Interpolator = new OvershootInterpolator(), Duration = 1000, StartDelay = 600 }.Start();
}
}
}
}