Erstellen von Diagrammen in Xamarin.Forms Portable Anwendung mit OxyPlot?

Question

Guten Tag alle. Ich erstelle eine Xamarin.Forms Portable Anwendung und möchte dort ein Diagramm mit einem OxyPlot anzeigen.

Aber die Codes, die ich im Internet gefunden habe, scheint nicht gut zu funktionieren. Ich möchte nur fragen, wie ich ein Diagramm, speziell Kreisdiagramm hier in OxyPlot erstellen werde. Von meinem XAML zu XAML.cs und zu anderen Dateien wie Modell und Viewmodel.

Können Sie mir bitte irgendwie eine Anleitung oder einen Code geben, vielleicht, wie soll ich das machen?

Ich möchte das Diagramm hier in meiner SalesPage codiert werden.

SalesPage.xaml

<?xml version="1.0" encoding="utf-8" ?> 
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
     xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
     x:Class="XamarinFormsDemo.Views.SalesPage" 
     xmlns:oxy="clr-namespace:OxyPlot.Xamarin.Forms;assembly=OxyPlot.Xamarin.Forms" 
     BackgroundImage="bg3.jpg" 
     Title="Sales Page"> 

</ContentPage> 

SalesPage.xaml.cs

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Threading.Tasks; 
using OxyPlot; 
using Xamarin.Forms; 
using OxyPlot.Xamarin.Forms; 

namespace XamarinFormsDemo.Views 
    { 
     public partial class SalesPage : ContentPage 
     {  
     public SalesPage() 
     { 
      InitializeComponent(); 
     } 
    } 
} 

MainActivity.cs

using System; 
using Android.App; 
using Android.Content.PM; 
using Android.Runtime; 
using Android.Views; 
using Android.Widget; 
using Android.OS; 
using ImageCircle.Forms.Plugin.Droid; 

namespace XamarinFormsDemo.Droid 
{ 
    [Activity(Label = "XamarinFormsDemo", Icon = "@drawable/recordsicon", MainLauncher = true, ConfigurationChanges = ConfigChanges.ScreenSize | ConfigChanges.Orientation)] 
public class MainActivity : global::Xamarin.Forms.Platform.Android.FormsApplicationActivity 
    { 
     protected override void OnCreate(Bundle bundle) 
     { 
     base.OnCreate(bundle); 
     global::Xamarin.Forms.Forms.Init(this, bundle); 
     OxyPlot.Xamarin.Forms.Platform.Android.PlotViewRenderer.Init(); 
     LoadApplication(new App()); 
     ImageCircleRenderer.Init(); 
     } 
    } 
} 

Diese ist eigentlich mein erstes Mal, um Charts zu erstellen, also bitte hilf mir. Danke für Ihre Hilfe.

Answer 1

Es gibt eine erste Anleitung für Oxy Plot und Xamarin.Forms here. Zur Beantwortung Ihrer Frage, können Sie folgendes tun:

<?xml version="1.0" encoding="utf-8" ?> 
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
     xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
     x:Class="XamarinFormsDemo.Views.SalesPage" 
     xmlns:oxy="clr-namespace:OxyPlot.Xamarin.Forms;assembly=OxyPlot.Xamarin.Forms" 
     BackgroundImage="bg3.jpg" 
     Title="Sales Page"> 

    <oxy:PieSeries ... /> 

</ContentPage> 

Es gibt mehr Dokumentation über die PieSerieshere ist und einige Proben davon here verwenden. Beispiel:

private static PlotModel CreateExample() 
    { 
     var model = new PlotModel { Title = "World population by continent" }; 

     var ps = new PieSeries 
     { 
      StrokeThickness = 2.0, 
      InsideLabelPosition = 0.8, 
      AngleSpan = 360, 
      StartAngle = 0 
     }; 

     // http://www.nationsonline.org/oneworld/world_population.htm 
     // http://en.wikipedia.org/wiki/Continent 
     ps.Slices.Add(new PieSlice("Africa", 1030) { IsExploded = true }); 
     ps.Slices.Add(new PieSlice("Americas", 929) { IsExploded = true }); 
     ps.Slices.Add(new PieSlice("Asia", 4157)); 
     ps.Slices.Add(new PieSlice("Europe", 739) { IsExploded = true }); 
     ps.Slices.Add(new PieSlice("Oceania", 35) { IsExploded = true }); 

     model.Series.Add(ps); 
     return model; 
    }