OxyPlot: построение нескольких графиков в одном окне с использованием OxyPlot и WindowsForms

Я использовал OxyPlot для одного из проектов, над которым я сейчас работаю, и он работал очень хорошо. Однако мне не удалось решить проблему построения нескольких графиков в одном окне. Моя цель - сделать что-то подобное.

Мой текущий сюжет выглядит так.

Вот часть моего кода

        var myModel = new PlotModel { Title = "REBA Score" };

        myModel.Axes.Add(new LinearAxis { Position = AxisPosition.Bottom, MajorGridlineStyle = LineStyle.Solid, MinorGridlineStyle = LineStyle.Dot, Minimum = 0, Maximum = a_count, Title = "Frame" });
        myModel.Axes.Add(new LinearAxis { Position = AxisPosition.Left, MajorGridlineStyle = LineStyle.Solid, MinorGridlineStyle = LineStyle.Dot, Minimum = 0, Maximum = 15, Title = "Score" });



        var series1 = new LineSeries
        {
            StrokeThickness = 1,
            MarkerSize = 1,
        };

        for (int i = 0; i < a_count; i++)
        {
            int x_val = i;
            int y_val = scores[0, i]; //"scores" is an array with my data

            series1.Points.Add(new DataPoint(x_val, y_val));

        }

        myModel.Series.Add(series1);


        this.plot1.Model = myModel //plot1 is an object of PlotView

Я хочу использовать один и тот же метод "Создать линейный ряд -> заполнить -> график" для нескольких различных массивов данных и отобразить его, как упоминалось ранее. Я использую WindowsForms и OxyPlot для этого проекта.

3 ответа

Решение

Вот что я сделал по рекомендации bgura.

Сначала я создал несколько PlotView и установил их свойства. Я изменил их размер, чтобы они не занимали все окно, и постарался закомментировать строку, в которой было установлено свойство Dock для заполнения, поскольку это привело к тому, что изменение размера не дало никаких результатов. Затем вы можете отрегулировать размер Формы и отдельных PlotView для достижения многосюжетного эффекта.

    private OxyPlot.WindowsForms.PlotView plot1;
    private OxyPlot.WindowsForms.PlotView plot2;
    private OxyPlot.WindowsForms.PlotView plot3;


         private void InitializeComponent()
    {
        this.plot1 = new OxyPlot.WindowsForms.PlotView();
        this.plot2 = new OxyPlot.WindowsForms.PlotView();
        this.plot3 = new OxyPlot.WindowsForms.PlotView();
        this.SuspendLayout();
        // 
        // plot1
        // 
        //this.plot1.Dock = System.Windows.Forms.DockStyle.Fill;
        this.plot1.Location = new System.Drawing.Point(0, 0);
        this.plot1.Name = "plot1";
        this.plot1.PanCursor = System.Windows.Forms.Cursors.Hand;
        this.plot1.Size = new System.Drawing.Size(300, 300);
        this.plot1.TabIndex = 0;
        this.plot1.Text = "plot1";
        this.plot1.ZoomHorizontalCursor = System.Windows.Forms.Cursors.SizeWE;
        this.plot1.ZoomRectangleCursor = System.Windows.Forms.Cursors.SizeNWSE;
        this.plot1.ZoomVerticalCursor = System.Windows.Forms.Cursors.SizeNS;
        // 
        // plot2
        // 
        //this.plot2.Dock = System.Windows.Forms.DockStyle.Fill;
        this.plot2.Location = new System.Drawing.Point(300, 0);
        this.plot2.Name = "plot2";
        this.plot2.PanCursor = System.Windows.Forms.Cursors.Hand;
        this.plot2.Size = new System.Drawing.Size(300, 300);
        this.plot2.TabIndex = 0;
        this.plot2.Text = "plot2";
        this.plot2.ZoomHorizontalCursor = System.Windows.Forms.Cursors.SizeWE;
        this.plot2.ZoomRectangleCursor = System.Windows.Forms.Cursors.SizeNWSE;
        this.plot2.ZoomVerticalCursor = System.Windows.Forms.Cursors.SizeNS;
        // 
        // plot3
        // 
        //this.plot3.Dock = System.Windows.Forms.DockStyle.Fill;
        this.plot3.Location = new System.Drawing.Point(900, 600 );
        this.plot3.Name = "plot3";
        this.plot3.PanCursor = System.Windows.Forms.Cursors.Hand;
        this.plot3.Size = new System.Drawing.Size(300,300);
        this.plot3.TabIndex = 0;
        this.plot3.Text = "plot3";
        this.plot3.ZoomHorizontalCursor = System.Windows.Forms.Cursors.SizeWE;
        this.plot3.ZoomRectangleCursor = System.Windows.Forms.Cursors.SizeNWSE;
        this.plot3.ZoomVerticalCursor = System.Windows.Forms.Cursors.SizeNS;
        // 
        // Form1
        // 
        this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
        this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
        this.ClientSize = new System.Drawing.Size(1225, 900);
        this.Controls.Add(this.plot3);
        this.Controls.Add(this.plot1);
        this.Controls.Add(this.plot2);
        this.Name = "Form1";
        this.Text = "plot3 Score";
        this.ResumeLayout(false);

    }

Затем я создал несколько моделей PlotModel, заполнил их данными и присвоил их соответствующим PlotView:

        this.InitializeComponent();

        //Setup plot1
        var plot1_model = new PlotModel { Title = "plot1 Score" };

        plot1_model.Axes.Add(new LinearAxis { Position = AxisPosition.Bottom, MajorGridlineStyle = LineStyle.Solid, MinorGridlineStyle = LineStyle.Dot, Minimum = 0, Maximum = a_count, Title = "Frame" });
        plot1_model.Axes.Add(new LinearAxis { Position = AxisPosition.Left, MajorGridlineStyle = LineStyle.Solid, MinorGridlineStyle = LineStyle.Dot, Minimum = 0, Maximum = 15, Title = "Score" });


        var plot1_Series = new LineSeries { StrokeThickness = 1, MarkerSize = 1 };

        for (int i = 0; i < a_count; i++)
        {
            int x_val = i;
            int y_val = your_data[0, i];

            plot1_Series.Points.Add(new DataPoint(x_val, y_val));

        }

        plot1_model.Series.Add(plot1_Series);

        //Setup plot2
        var plot2_Model = new PlotModel { Title = "plot2 Score" };

        plot2_Model.Axes.Add(new LinearAxis { Position = AxisPosition.Bottom, MajorGridlineStyle = LineStyle.Solid, MinorGridlineStyle = LineStyle.Dot, Minimum = 0, Maximum = a_count, Title = "Frame" });
        plot2_Model.Axes.Add(new LinearAxis { Position = AxisPosition.Left, MajorGridlineStyle = LineStyle.Solid, MinorGridlineStyle = LineStyle.Dot, Minimum = 0, Maximum = 15, Title = "Score" });


        var plot2_Series = new LineSeries { StrokeThickness = 1, MarkerSize = 1 };

        for (int i = 0; i < a_count; i++)
        {
            int x_val = i;
            int y_val = your_data[1, i];

            plot2_Series.Points.Add(new DataPoint(x_val, y_val));

        }

        plot2_Model.Series.Add(plot2_Series);







        //Setup plot3
        var plot3_Model = new PlotModel { Title = "plot3 Score" };

        plot3_Model.Axes.Add(new LinearAxis { Position = AxisPosition.Bottom, MajorGridlineStyle = LineStyle.Solid, MinorGridlineStyle = LineStyle.Dot, Minimum = 0, Maximum = a_count, Title = "Frame" });
        plot3_Model.Axes.Add(new LinearAxis { Position = AxisPosition.Left, MajorGridlineStyle = LineStyle.Solid, MinorGridlineStyle = LineStyle.Dot, Minimum = 0, Maximum = 15, Title = "Score" });


        var plot3_Series = new LineSeries{ StrokeThickness = 1, MarkerSize = 1};

        for (int i = 0; i < a_count; i++)
        {
            int x_val = i;
            int y_val = your_data[3, i];

            plot3_Series.Points.Add(new DataPoint(x_val, y_val));

        }
        this.plot1.Model = plot1_Model;
        this.plot2.Model = plot2_model;
        this.plot3.Model = plot3_Model;

Надеемся, что это может помочь кому-то, кто должен реализовать ту же функцию. На случай, если кому-то интересно, я в значительной степени использовал программу HelloWorld из документации OxyPlot и добавил к ней. Это можно найти здесь

Я использовал TableLayoutPanel, чтобы расположить отдельные графики в разных строках и столбцах. Я планирую программно добавить графики, чтобы я мог добавить строки и закрепить их в макете.

Поскольку я столкнулся с той же проблемой, я хочу предложить свое решение этой темы. Если вы хотите построить более одного графика (с разными масштабами) в одном Plotview, вам не нужно каждый раз создавать новый Plotview. просто назначьте «AxisKey» для оси, к которой вы хотите добавить новый график.

например: Это оси:

      Dim xAxes As New OxyPlot.Axes.DateTimeAxis()
With xAxes
    .Key = "x_first_Time"
    .Position = Axes.AxisPosition.Bottom
    .StringFormat = "HH:mm:ss"
    .Unit = "ms"
    .Title = "Zeitintervall"
    .TitleFont = "Arial"
    .TitleFontSize = 18.0!
    .TitleFontWeight = FontWeights.Bold
    .MajorGridlineStyle = LineStyle.Dot
    .MajorGridlineThickness = 0.5

End With
model.Axes.Add(xAxes)

Dim yAxestemp As New OxyPlot.Axes.LinearAxis()
With yAxestemp
    .Position = Axes.AxisPosition.Left
    .Unit = "deg Celsius"
    .Key = "y_first_Temp"
    .TitlePosition = 0.5
    .AxisTitleDistance = 10
    .Title = "Temperatur "
    .TitleFont = "Arial"
    .TitleFontSize = 18.0!
    .TitleFontWeight = FontWeights.Bold
    .MajorGridlineStyle = LineStyle.Dot
    .MajorGridlineThickness = 0.5

End With
model.Axes.Add(yAxestemp)

Dim yAxesRPM As New OxyPlot.Axes.LinearAxis()
With yAxesRPM
    .Position = Axes.AxisPosition.Right
    .Unit = "1/min"
    .Key = "y_second_RPM"
    .TitlePosition = 0.5
    .AxisTitleDistance = 10
    .Title = "Drehzahl "
    .TitleFont = "Arial"
    .TitleFontSize = 18.0!
    .TitleFontWeight = FontWeights.Bold

End With
model.Axes.Add(yAxesRPM)
Plot.Model = model

И серия выглядит так:

      With Sensor1series
    .Title = "Sensor_1"
    .YAxisKey = "y_first_Temp"
End With
model.Series.Add(Sensor1series)

With Sensor2series
    .Title = "Sensor_2"
    .YAxisKey = "y_first_Temp"
End With
model.Series.Add(Sensor2series)

With Sensor3series
    .Title = "Sensor_3"
    .YAxisKey = "y_first_Temp"
End With
model.Series.Add(Sensor3series)

With Sensor4series
    .Title = "Sensor_4"
    .YAxisKey = "y_first_Temp"
End With
model.Series.Add(Sensor4series)

With drehzahlseries
    .Title = "Drehzahl [rpm]"
    .LineStyle = LineStyle.Dot
    .YAxisKey = "y_second_RPM"
End With
model.Series.Add(drehzahlseries)

Чтобы заполнить эти серии некоторыми данными, я создал список с данными в другом классе. Это пример заполнения серии:

      Sensor1series.Points.Add(New OxyPlot.DataPoint(Time, Datalist.Last.tempvalue1))
Sensor2series.Points.Add(New OxyPlot.DataPoint(Time, Datalist.Last.tempvalue2))
Sensor3series.Points.Add(New OxyPlot.DataPoint(Time, Datalist.Last.tempvalue3))
Sensor4series.Points.Add(New OxyPlot.DataPoint(Time, Datalist.Last.tempvalue4))
drehzahlseries.Points.Add(New OxyPlot.DataPoint(Time, Datalist.Last.RPM))
TextBox_Time.Text = Datalist.Last.time.ToString()

Вот так должно быть, с Rpm на вторичной оси.

Другие вопросы по тегам