Xamarin 形成条形图的 OxyPlot

May*_*ava 4 .net c# xaml oxyplot xamarin.forms

我正在开发 Xamarin.Forms 应用程序,我想在其中实现屏幕截图中所附的条形图。Xamarin.Forms 中没有此类控件,因此我使用 OxyPlot nuget 包来实现此目的,但问题是 oxyplot 中的条形图是水平的,并且图中没有网格线选项。是否有任何用于条形图的开源库以便我可以使用。在此输入图像描述

jsa*_*ics 5

您可以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>
Run Code Online (Sandbox Code Playgroud)

查看型号:

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);
    }
}
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述