C# 如何在WPF动态数据显示中制作多个折线图？

我在c#（wpf应用程序）中有3个集合。我需要给他们看一张折线图。我研究了太多的网站，我只有动态数据显示d3。所以我试着在wpf中制作一个如下的图表

我从stackoverflow中找到了一个代码，但我无法按照我的想法编写。我只能在字段中显示一行，它只能显示如下

我的另一个问题是水平轴。如何将水平值设置为字符串或[10-2016]。这是我找到的密码

MainWindow.xaml

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfApplication1"
    xmlns:d3="clr-namespace:Microsoft.Research.DynamicDataDisplay;assembly=DynamicDataDisplay"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525" Loaded="Window_Loaded">
    <Grid>
        <d3:ChartPlotter>
            <d3:LineGraph DataSource="{Binding Data}"></d3:LineGraph>
        </d3:ChartPlotter>
    </Grid>
</Window>

MainWindow.xaml.cs

MyViewModel viewModel;

        public MainWindow()
        {
            InitializeComponent();

            viewModel = new MyViewModel(); 
            DataContext = viewModel;
        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            double[] my_array = new double[10];

            for (int i = 0; i < my_array.Length; i++)
            {
                my_array[i] = Math.Sin(i)*3;
                viewModel.Data.Collection.Add(new Point(i, my_array[i]));
            }

        }

MyViewModel视图模型；
公共主窗口（）
{
初始化组件（）；
viewModel=新的MyViewModel（）；
DataContext=viewModel；
}
已加载私有无效窗口（对象发送器、路由目标）
{
double[]我的数组=新的double[10]；
for（int i=0；i

MyViewModel.cs

public class MyViewModel
{
    public ObservableDataSource<Point> Data { get; set; }

    public MyViewModel()
    {
        Data = new ObservableDataSource<Point>();
    }
}

公共类MyViewModel
{
公共ObservedataSource数据{get；set；}
公共MyViewModel（）
{
数据=新的ObservableDataSource（）；
}
}

---

有没有什么简单的方法可以把图表做成上面的图片。我不知道任何关于wpf图表，我也没有任何预算支付wpf图表库。我希望任何人都能帮助我。

我建议你使用实时图表

图形上的每一条线都由一个“LineSeries”表示，并且设计为MVVM友好型。它是100%免费的，您可以使用NuGet安装

例如：

Xaml：

视图模型：

public class ViewModel
{
    public SeriesCollection SeriesCollection { get; set; }
    public string[] Labels { get; set; }
    public Func<double, string> YFormatter { get; set; }

    public ViewModel()
    {
        SeriesCollection = new SeriesCollection
        {
            new LineSeries
            {
                Title = "Series 1",
                Values = new ChartValues<double> { 4, 6, 5, 2 ,4 }
            },
            new LineSeries
            {
                Title = "Series 2",
                Values = new ChartValues<double> { 6, 7, 3, 4 ,6 },
                PointGeometry = null
            },
            new LineSeries
            {
                Title = "Series 3",
                Values = new ChartValues<double> { 4,2,7,2,7 },
                PointGeometry = DefaultGeometries.Square,
                PointGeometrySize = 15
            }
        };

        Labels = new[] {"Jan", "Feb", "Mar", "Apr", "May"};
        YFormatter = value => value.ToString("C");

        //modifying the series collection will animate and update the chart
        SeriesCollection.Add(new LineSeries
        {
            Title = "Series 4",
            Values = new ChartValues<double> {5, 3, 2, 4},
            LineSmoothness = 0, //0: straight lines, 1: really smooth lines
            PointGeometry = Geometry.Parse("m 25 70.36218 20 -28 -20 22 -8 -6 z"),
            PointGeometrySize = 50,
            PointForeground = Brushes.Gray
        });

        //modifying any series values will also animate and update the chart
        SeriesCollection[3].Values.Add(5d);
    }
}

公共类视图模型
{
公共序列集合序列集合{get；set；}
公共字符串[]标签{get；set；}
公共函数YFormatter{get；set；}
公共视图模型（）
{
SeriesCollection=新的SeriesCollection
{
新系列
{
Title=“系列1”，
值=新图表值{4,6,5,2,4}
},
新系列
{
Title=“系列2”，
值=新图表值{6,7,3,4,6}，
PointGeometry=null
},
新系列
{
Title=“系列3”，
值=新图表值{4,2,7,2,7}，
PointGeometry=默认几何体.Square，
PointGeometrySize=15
}
};
标签=新[]{“一月”、“二月”、“三月”、“四月”、“五月”}；
YFormatter=value=>value.ToString（“C”）；
//修改系列集合将设置图表动画并更新图表
SeriesCollection.Add（新的线条系列
{
Title=“系列4”，
值=新图表值{5,3,2,4}，
LineSmoothness=0，//0:直线，1:真正平滑的直线
PointGeometry=Geometry.Parse（“M2570.3621820-28-2022-8-6Z”），
PointGeometrySize=50，
点前景=画笔。灰色
});
//修改任何系列值也将设置图表动画并更新图表
seriecollection[3].Values.Add（5d）；
}
}

输出：

---

您检查过oxyplot库了吗？这是一个非常好的WPF库。它可能比d3更容易使用。@Gimly我试过oxyplot。但是我没有找到任何关于这个的教程。所以我来不了。任何库都不重要，我只想解决我的问题。使用Oxyplot可以很容易地满足您的要求，但我同意您的意见，文档有点缺乏。最简单的入门方法是转到并检查示例。不要犹豫克隆oxyplot repo并检查所有代码，这很容易理解。

public class ViewModel
{
    public SeriesCollection SeriesCollection { get; set; }
    public string[] Labels { get; set; }
    public Func<double, string> YFormatter { get; set; }

    public ViewModel()
    {
        SeriesCollection = new SeriesCollection
        {
            new LineSeries
            {
                Title = "Series 1",
                Values = new ChartValues<double> { 4, 6, 5, 2 ,4 }
            },
            new LineSeries
            {
                Title = "Series 2",
                Values = new ChartValues<double> { 6, 7, 3, 4 ,6 },
                PointGeometry = null
            },
            new LineSeries
            {
                Title = "Series 3",
                Values = new ChartValues<double> { 4,2,7,2,7 },
                PointGeometry = DefaultGeometries.Square,
                PointGeometrySize = 15
            }
        };

        Labels = new[] {"Jan", "Feb", "Mar", "Apr", "May"};
        YFormatter = value => value.ToString("C");

        //modifying the series collection will animate and update the chart
        SeriesCollection.Add(new LineSeries
        {
            Title = "Series 4",
            Values = new ChartValues<double> {5, 3, 2, 4},
            LineSmoothness = 0, //0: straight lines, 1: really smooth lines
            PointGeometry = Geometry.Parse("m 25 70.36218 20 -28 -20 22 -8 -6 z"),
            PointGeometrySize = 50,
            PointForeground = Brushes.Gray
        });

        //modifying any series values will also animate and update the chart
        SeriesCollection[3].Values.Add(5d);
    }
}