Xamarin 为条形图创建 OxyPlot

Question

我正在开发 Xamarin.Forms 应用程序，我想在其中实现截图中所附的条形图。 Xamarin.Forms 中没有这样的控件，所以我为此使用了 OxyPlot nuget 包，但问题是 oxyplot 中的条是水平的，并且在图形图中没有网格线选项。是否有任何用于条形图的开源库，以便我可以使用。

Answer 1

我已经使用了这个优秀的开源库，它绑定了 Xamarin.iOS 和 Xamarin.Android，您将必须执行自定义渲染器才能在 Xamarin.Forms 上显示图表，但它高度可定制：

Android: https://github.com/PhilJay/MPAndroidChart

iOS: https://github.com/danielgindi/Charts

Xamarin Android： https://github.com/Flash3001/MPAndroidChart.Xamarin

Xamarin iOS： https://github.com/Flash3001/iOSCharts.Xamarin

它们以 NuGet 包的形式提供。

Answer 2

您可以使用 OxyPlot 使用 ColumnSeries 来完成。试试这个 MCVE:

XAML:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:App2"
             xmlns:oxy="clr-namespace:OxyPlot.Xamarin.Forms;assembly=OxyPlot.Xamarin.Forms"
             x:Class="App2.MainPage">

    <ContentPage.BindingContext>
        <local:MyViewModel></local:MyViewModel>
    </ContentPage.BindingContext>

    <oxy:PlotView Model="{Binding Model}"/>

</ContentPage>

查看模型：

using OxyPlot;
using OxyPlot.Series;
using OxyPlot.Axes;

public class MyViewModel
{
    public PlotModel Model { get; set; }

    public MyViewModel()
    {
        CategoryAxis xaxis = new CategoryAxis();
        xaxis.Position = AxisPosition.Bottom;
        xaxis.MajorGridlineStyle = LineStyle.Solid;
        xaxis.MinorGridlineStyle = LineStyle.Dot;
        xaxis.Labels.Add("Mon, 4/24");
        xaxis.Labels.Add("Tue, 4/25");
        xaxis.Labels.Add("Wed, 4/26");
        xaxis.Labels.Add("Thu, 4/27");

        LinearAxis yaxis = new LinearAxis();
        yaxis.Position = AxisPosition.Left;
        yaxis.MajorGridlineStyle = LineStyle.Dot;
        xaxis.MinorGridlineStyle = LineStyle.Dot;

        ColumnSeries s1 = new ColumnSeries();
        s1.IsStacked = true;
        s1.Items.Add(new ColumnItem(20));
        s1.Items.Add(new ColumnItem(60));
        s1.Items.Add(new ColumnItem(40));
        s1.Items.Add(new ColumnItem(50));

        ColumnSeries s2 = new ColumnSeries();
        s2.IsStacked = true;
        s2.Items.Add(new ColumnItem(50));
        s2.Items.Add(new ColumnItem(30));
        s2.Items.Add(new ColumnItem(10));
        s2.Items.Add(new ColumnItem(20));

        Model = new PlotModel();
        Model.Title = "Xamarin Oxyplot Sample";
        Model.Background = OxyColors.Gray;

        Model.Axes.Add(xaxis);
        Model.Axes.Add(yaxis);
        Model.Series.Add(s1);
        Model.Series.Add(s2);
    }
}

Xamarin 为条形图创建 OxyPlot

Xamarin Forms OxyPlot for Bar charts

.net

c#

xaml

oxyplot

xamarin.forms