Those who are working with Xamarin.Forms, know that there is no out-of-the-box support for charts/graphs in Xamarin Forms. If you want to show any data report in the form of charts/graph like Pie, Bar etc., you will have to use third party graph controls like Syncfusion (Some Xamarin pre-built examples use these), Infragistics, or Telerik controls and you have to pay license fees for them.
There is a little known open source plotting library for Xamarin.Forms called OxyPlot. This library is not only free/open source but it’s easy to use too. However, you may have to play around with code samples to understand the working of these graph controls. In this article, we will learn how to use a few of graph options in OxyPlot.
- As usual, create a new Xamarin.Forms XAML Project.
- Add the NuGet Package named ‘OxyPlot.Xamarin.Forms’ to all your projects, as shown in the below image.
- Just like Xamarin.Forms, Oxyplot also needs to be initialized in the platform specific projects so that it can work.
- Add the following code in MainActivity.cs file of your Android project, just after global::Xamarin.Forms.Forms.Init(this, bundle); line in onCreate method.
- OxyPlot.Xamarin.Forms.Platform.Android.PlotViewRenderer.Init();
- Similarly, Add the following code in AppDelegate.cs file of your iOS project, just after global::Xamarin.Forms.Forms.Init(); line in FinishedLaunching method.
- OxyPlot.Xamarin.Forms.Platform.iOS.PlotViewRenderer.Init();
- And in the same way, add the following code in App.xaml.cs file of your UWP project, just after Xamarin.Forms.Forms.Init(e); line in FinishedLaunching method.
- OxyPlot.Xamarin.Forms.Platform.UWP.PlotViewRenderer.Init();
This article has just scratched the surface of using Oxyplot controls to create different types of charts and graphs. You can experiment more with it by trying out these examples. Let me know if you need any particular graph example.