如何在 OxyPlot 图表上绘制 MULTIPLE LineSeries？

Question

我很抱歉问了这么多 OxyPlot 问题，但我似乎真的很难使用 OxyPlot 图表控件。

我的项目是 WPF 格式，所以我最初使用托管的 WINFORMS 图表，它的工作原理非常棒，并且完全满足了我的需求，直到我需要在托管的 winform 图表上覆盖一个 WPF 元素。 由于“AirSpace”问题，无论我做什么，我都无法看到放在托管图表顶部的 WPF 元素。 那是我决定使用 OxyPlot 的时候，到目前为止，这让我很头疼。

这是我的原始问题！ 我在 CodePlex 上问过的。 我在那里似乎没有得到太多帮助，所以我在这里再试一次。

我的问题是：

有谁知道如何将 MULTIPLE LineSeries 绘制到图上？

到目前为止我的方法：

我正在使用 ac# List 数组并添加 LineSeries 的新副本，其中包含要绘制的新数据。 我的代码：

    // Function to plot data
    private void plotData(double numWeeks, double startingSS)
    {

        // Initialize new Salt Split class for acess to data variables
        Salt_Split_Builder calcSS = new Salt_Split_Builder();
        calcSS.compute(numWeeks, startingSS, maxDegSS);

        // Create the OxyPlot graph for Salt Split
        OxyPlot.Wpf.PlotView plot = new OxyPlot.Wpf.PlotView();

        var model = new PlotModel();

        // Add Chart Title
        model.Title = "Salt Split Degradation";

        // Create new Line Series
        LineSeries linePoints = new LineSeries() { StrokeThickness = 1, MarkerSize = 1, Title = numWeeks.ToString() + " weeks" };

        // Add each point to the new series
        foreach (var point in calcSS.saltSplitCurve)
        {
            DataPoint XYpoint = new DataPoint();
            XYpoint = new DataPoint(point.Key, point.Value * 100);
            linePoints.Format("%", XYpoint.Y);
            linePoints.Points.Add(XYpoint);
        }

        listPointAray.Add(linePoints);

        // Define X-Axis
        var Xaxis = new OxyPlot.Axes.LinearAxis();
        Xaxis.Maximum = numWeeks;
        Xaxis.Minimum = 0;
        Xaxis.Position = OxyPlot.Axes.AxisPosition.Bottom;
        Xaxis.Title = "Number of Weeks";
        model.Axes.Add(Xaxis);

        //Define Y-Axis
        var Yaxis = new OxyPlot.Axes.LinearAxis();
        Yaxis.MajorStep = 15;
        Yaxis.Maximum = calcSS.saltSplitCurve.Last().Value * 100;
        Yaxis.MaximumPadding = 0;
        Yaxis.Minimum = 0;
        Yaxis.MinimumPadding = 0;
        Yaxis.MinorStep = 5;
        Yaxis.Title = "Percent Degradation";
        model.Axes.Add(Yaxis);

        // Add Each series to the
        foreach (var series in listPointAray)
        {
            LineSeries newpoints = new LineSeries();
            newpoints = linePoints;
            model.Series.Add(newpoints);
        }

        // Add the plot to the window
        plot.Model = model;
        SaltSplitChartGrid.Children.Add(plot);

    }

我的代码在我第一次按下“图形数据”按钮时工作，但连续尝试失败并出现以下错误：

无法添加元素，它已属于绘图模型

下面的图是我想要生成的图类型（使用 WinForms Chart 控件可以正常工作）：

我希望每次运行该方法时都绘制一条具有新颜色的新线。

Answer 1

这就是我之前在 OxyPlot 图表上创建多行的方式，关键是为每个系列创建一组数据点 - 在以下示例代码中称为 circlePoints 和 linePoints，然后将它们绑定到 CircleSeries 和 LineSeries：

var xAxis = new DateTimeAxis
{
    Position = AxisPosition.Bottom,
    StringFormat = Constants.MarketData.DisplayDateFormat,
    Title = "End of Day",
    IntervalLength = 75,
    MinorIntervalType = DateTimeIntervalType.Days,
    IntervalType = DateTimeIntervalType.Days,
    MajorGridlineStyle = LineStyle.Solid,
    MinorGridlineStyle = LineStyle.None,
};

var yAxis = new LinearAxis
{
    Position = AxisPosition.Left,
    Title = "Value",
    MajorGridlineStyle = LineStyle.Solid,
    MinorGridlineStyle = LineStyle.None
};

var plot = new PlotModel();
plot.Axes.Add(xAxis);
plot.Axes.Add(yAxis);

var circlePoints = new[]
{
    new ScatterPoint(DateTimeAxis.ToDouble(date1), value1),
    new ScatterPoint(DateTimeAxis.ToDouble(date2), value2),
};

var circleSeries =  new ScatterSeries
{
    MarkerSize = 7,
    MarkerType = MarkerType.Circle,
    ItemsSource = circlePoints
};

var linePoints = new[]
{
    new DataPoint(DateTimeAxis.ToDouble(date1), value1),
    new DataPoint(DateTimeAxis.ToDouble(date2), value2),
};

var lineSeries = new LineSeries
{
    StrokeThickness = 2,
    Color = LineDataPointColor,
    ItemsSource = linePoints
};

plot.Series.Add(circleSeries);
plot.Series.Add(lineSeries);

Answer 2

成功！！！！

AwkwardCoder，谢谢你的帮助，但我意识到我的错误只是我忽略了一些事情！

这是有效的代码版本：

        // Make a new plotmodel
    private PlotModel model = new PlotModel();

    // Create the OxyPlot graph for Salt Split
    private OxyPlot.Wpf.PlotView plot = new OxyPlot.Wpf.PlotView();

    // Function to plot data
    private void plotData(double numWeeks, double startingSS)
    {
        List<LineSeries> listPointAray = new List<LineSeries>();

        // Initialize new Salt Split class for acess to data variables
        Salt_Split_Builder calcSS = new Salt_Split_Builder();
        calcSS.compute(numWeeks, startingSS, maxDegSS);

        // Create new Line Series
        LineSeries linePoints = new LineSeries() 
        { StrokeThickness = 1, MarkerSize = 1, Title = numWeeks.ToString() + " weeks" };


        // Add each point to the new series
        foreach (var point in calcSS.saltSplitCurve)
        {
            DataPoint XYpoint = new DataPoint();
            XYpoint = new DataPoint(point.Key, point.Value * 100);
            linePoints.Format("%", XYpoint.Y);
            linePoints.Points.Add(XYpoint);
        }

        listPointAray.Add(linePoints);

        // Add Chart Title
        model.Title = "Salt Split Degradation";

        // Add Each series to the
        foreach (var series in listPointAray)
        {
            // Define X-Axis
            OxyPlot.Axes.LinearAxis Xaxis = new OxyPlot.Axes.LinearAxis();
            Xaxis.Maximum = numWeeks;
            Xaxis.Minimum = 0;
            Xaxis.Position = OxyPlot.Axes.AxisPosition.Bottom;
            Xaxis.Title = "Number of Weeks";
            model.Axes.Add(Xaxis);

            //Define Y-Axis
            OxyPlot.Axes.LinearAxis Yaxis = new OxyPlot.Axes.LinearAxis();
            Yaxis.MajorStep = 15;
            Yaxis.Maximum = calcSS.saltSplitCurve.Last().Value * 100;
            Yaxis.MaximumPadding = 0;
            Yaxis.Minimum = 0;
            Yaxis.MinimumPadding = 0;
            Yaxis.MinorStep = 5;
            Yaxis.Title = "Percent Degradation";
            //Yaxis.StringFormat = "{0.00} %";
            model.Axes.Add(Yaxis);

            model.Series.Add(series);
        }


        // Add the plot to the window

        plot.Model = model;
        plot.InvalidatePlot(true);
        SaltSplitChartGrid.Children.Clear();
        SaltSplitChartGrid.Children.Add(plot);

    }

以下是我做错的多件事：

1. 在我的 foreach var 系列循环中，我添加了已添加的原始系列，而不是列表中的下一个 var 系列！ （哑的！）
2. 每次运行该方法时，我都在创建一个新模型。 这意味着每次运行代码时，我都会添加之前模型中已经存在的系列。 （也蠢！）
3. 我每次都在创建一个新图，并尝试在新图中添加一个已经属于前一个图的模型。 （越来越傻了..）
4. 每次运行该方法时，该图都会添加到网格中，因此在重新添加相同的图之前，我必须先清除网格的子项。
5. 我没有刷新情节。

那是很多错误，但我克服了它。 希望这对将来的人有所帮助。 另外，我知道我没有使用普通的数据绑定技术，但这至少是有效的。

最后结果：

Answer 3

以下是在 XAML 中获得类似结果的方法，尤其是在使用 MVVM 方法时。

视图模型：

public ObservableCollection<DataPoint> DataPointList1 {get;set;}
public ObservableCollection<DataPoint> DataPointList2 {get;set;}
public ObservableCollection<DataPoint> DataPointList3 {get;set;}
public ObservableCollection<DataPoint> DataPointList4 {get;set;}

使用如下所示的 for 循环，使用适当的数据集填充 DataPointList1 到 DataPointList4。

for (int i = 0; i < dataList.Count; i++)
{
    DataPointList1 .Add(new DataPoint{dataList[i].XValue,dataList[i].YValue });
}

XAML：

    xmlns:oxy="http://oxyplot.org/wpf"

<oxy:Plot LegendPlacement="Outside" LegendPosition="RightMiddle" Title="Your Chart Title" >
    <oxy:Plot.Axes>
        <oxy:LinearAxis Title="Your X-axis Title" Position="Bottom" IsZoomEnabled="True" />
       <oxy:LinearAxis Title="Your Y-axis Title" Position="Left" IsZoomEnabled="True" />
  </oxy:Plot.Axes>
  <oxy:Plot.Series>
       <oxy:LineSeries Title="Plot1"  Color="Black"  ItemsSource="{Binding DataPointList1 }"/>
       <oxy:LineSeries Title="Plot2"  Color="Green"  ItemsSource="{Binding DataPointList2 }"/>
       <oxy:LineSeries Title="Plot3"  Color="Blue"   ItemsSource="{Binding DataPointList3 }"/>
       <oxy:LineSeries Title="Plot4"  Color="Red" ItemsSource="{Binding DataPointList4 }"/>
   </oxy:Plot.Series>
</oxy:Plot>