OxyPlot Mono untuk Android (alias Xamarin.Android) Undian Salah Tempat. (Seri Kolom Bertumpuk)

Saya menggunakan Perpustakaan OxyPlot, dan saya mencoba menampilkan Bagan Kolom Bertumpuk, tetapi tampilannya salah.

Berikut adalah mockup bagaimana seharusnya grafik tersebut:

Bagan Batang Bertumpuk yang Diharapkan

Inilah cara saya membuat PlotModel:

private void InitWidget ()
{

    _goalsPlotModel = new PlotModel ("Metas") {
        LegendPlacement = LegendPlacement.Outside,
        LegendPosition = LegendPosition.BottomCenter,
        LegendOrientation = LegendOrientation.Horizontal,
        LegendBorderThickness = 0
    };

    SelectedChannel = new ListOfValue ();
    SelectedProduct = new Product ();

    SelectedChannel.Code = string.Empty;
    SelectedProduct.ProductCode = string.Empty;

    LoadFilters ();
    Refresh ();
}

Inilah cara saya menambahkan Seri:

private void FillGoalsPlotModel ()
{
    _goalsPlotModel.Series.Clear ();
    _goalsPlotModel.Axes.Clear ();

    var goals = new ColumnSeries {
        Title = "Goals",
        FillColor = OxyColors.Orange,
        IsStacked = true,
        StrokeColor = OxyColors.Black,
        StrokeThickness = 1
    };

    var sales = new ColumnSeries {
        Title = "Sales",
        FillColor = OxyColors.LightGreen,
        IsStacked = true,
        StrokeColor = OxyColors.White,
        StrokeThickness = 1
    };

    var surplus = new ColumnSeries {
        Title = "Surplus",
        FillColor = OxyColors.Cyan,
        IsStacked = true,
        StrokeColor = OxyColors.Black,
        StrokeThickness = 1
    };

    var categoryAxisForMonths = new CategoryAxis { 
        Position = AxisPosition.Bottom 
    };

    var valueAxis = new LinearAxis (AxisPosition.Left) { 
        MinimumPadding = 0, 
        MaximumPadding = 0.06, 
        AbsoluteMinimum = 0 
    };


    foreach (IGoal goal in _goals) {

        if (goal.GetSales () > goal.GetGoalValue ()) {
            sales.Items.Add (new ColumnItem { Value = goal.GetGoalValue () });
            surplus.Items.Add (new ColumnItem { Value = goal.GetSurplus () });
        } else {
            sales.Items.Add (new ColumnItem { Value = goal.GetSales () });
            goals.Items.Add (new ColumnItem { 
                Value = goal.GetGoalValue() - goal.GetSales ()  
            });
        }
    }

    foreach (var month in GetMonths()) {
        categoryAxisForMonths.Labels.Add (month);
    }


    _goalsPlotModel.Series.Add (sales);
    _goalsPlotModel.Series.Add (goals);
    _goalsPlotModel.Series.Add (surplus);

    _goalsPlotModel.Axes.Add (categoryAxisForMonths);
    _goalsPlotModel.Axes.Add (valueAxis);


    RaisePropertyChanged (() => GoalsPlotModel);
}

Dan inilah cara renderingnya:

Seri Kolom Bertumpuk Salah Tempat

Jika saya menyetel IsStacked ke false, itu hanya menggambar BarChart Vertikal, tetapi setiap bagian bawah bilah berada di y = 0 seperti yang diharapkan, tetapi jika IsStacked disetel ke true setiap bagian bawah bilah berada pada nilai y yang berbeda.

Apakah ini bug di Oxyplot untuk Mono untuk Android Renderer? Atau hanya saya yang melakukan sesuatu yang salah? (jika ya, apa yang saya lakukan salah?)


person Alberto Estrella    schedule 30.10.2013    source sumber
comment
Hai Alberto, bisakah Anda mengirimkan beberapa masukan (bisa jadi palsu) yang bisa saya uji?   -  person Noctis    schedule 04.11.2013


Jawaban (1)


Nah, yang berikut ini berfungsi untuk saya. Saya akan melampirkan beberapa tangkapan layar setelah kodenya, tapi menurut saya masalah Anda adalah cara Anda menambahkan poin ke tumpukan.

Anda menambahkan 2 poin (atau kolom sebenarnya) pada setiap kasus, tetapi Anda perlu menetapkan nilai ke 3 (yang ketiga adalah nol). Jika tidak, hasilnya akan terus bertumpuk sampai Anda mendapatkan 3, dan sepertinya tidak ada yang benar.

Xaml saya lurus ke depan:

<oxy:Plot Model="{Binding MyPlotModel}" />

Lalu saya memanggil metode ini dari konstruktor saya, untuk membuat dan mengatur model:

private void SetPlot()
{
    var model = new PlotModel("Metas")
    {
        LegendPlacement = LegendPlacement.Outside,
        LegendPosition = LegendPosition.BottomCenter,
        LegendOrientation = LegendOrientation.Horizontal,
        LegendBorderThickness = 0
    };

    var goals = new ColumnSeries {
        Title = "Goals",
        FillColor = OxyColors.Orange,
        IsStacked = true,
        StrokeColor = OxyColors.Black,
        StrokeThickness = 1
    };

    var sales = new ColumnSeries {
        Title = "Sales",
        FillColor = OxyColors.LightGreen,
        IsStacked = true,
        StrokeColor = OxyColors.White,
        StrokeThickness = 1
    };

    var surplus = new ColumnSeries {
        Title = "Surplus",
        FillColor = OxyColors.Cyan,
        IsStacked = true,
        StrokeColor = OxyColors.Black,
        StrokeThickness = 1
    };

    var categoryAxisForMonths = new CategoryAxis { 
        Position = AxisPosition.Bottom 
    };

    var valueAxis = new LinearAxis (AxisPosition.Left) { 
        MinimumPadding = 0, 
        MaximumPadding = 0.06, 
        AbsoluteMinimum = 0 
    };

    // Creating random data for 12 months
    for (int i = 0; i < 12; i++)
    {
        //var goal = 10;   // if you want a set goal, use this
        var goal = RandomHelper.RandomInt(8, 11); // otherwise use this
        var actualsales = RandomHelper.RandomInt(5, 15);

        if (actualsales > goal)
        {
            sales.Items.Add  (new ColumnItem( goal               ));
            surplus.Items.Add(new ColumnItem( actualsales-goal   ));
            goals.Items.Add  (new ColumnItem( 0                  ));
        }
        else
        {
            sales.Items.Add  (new ColumnItem( actualsales        ));
            goals.Items.Add  (new ColumnItem( goal - actualsales ));
            surplus.Items.Add(new ColumnItem( 0                  ));
        }

        // Next will create jan - dec in the labels
        categoryAxisForMonths.Labels.Add(CultureInfo.CurrentUICulture.DateTimeFormat.MonthNames[i]);

    }

    model.Series.Add (sales);
    model.Series.Add (goals);
    model.Series.Add (surplus);

    model.Axes.Add (categoryAxisForMonths);
    model.Axes.Add (valueAxis);

    MyPlotModel = model;
}
public PlotModel MyPlotModel { get; set; }

RandomHelper adalah kelas sederhana untuk membantu mendapatkan acak:

public static class RandomHelper
{
    private static readonly Random RandomSeed = new Random();

    public static int RandomInt(int min, int max)
    {
        return RandomSeed.Next(min, max);
    }
}

Dan inilah hasilnya:

Tujuan tetap

Tujuan acak

Garis-garis lucunya adalah hasil batas pada kolom yang kosong, tapi Anda pasti bisa mengetahuinya :)

person Noctis    schedule 04.11.2013