WPF LiveCharts 折线图XY轴关联赋值，可显示不同时间段数据

这篇文章来源于日常工作需求，情况如图

如果按照X轴，Y轴互不关联的独立赋值方式那么得到的结果是这样的

 可以看到B、C的数据和X轴的月份对应是错乱的，而我们想得到的应该是这样：

 

 上代码

public class Model
        {
            public double time { get; set; }
            public double value { get; set; }
        }

这里用来表示单个数据节点，记录了该节点X、Y坐标。

var mapper = Mappers.Xy()
                .X(model => model.time)
                .Y(model => model.value);

            Charting.For(mapper);

声明mapper，并将XY对应到time和value上，用于LiveCharts

            cv = new ChartValues();
            cv.Add(new Model { time = 0, value = 1 });
            cv.Add(new Model { time = 1, value = 2 });
            cv.Add(new Model { time = 2, value = 3 });
            cv.Add(new Model { time = 3, value = 4 });
            cv.Add(new Model { time = 4, value = 5 });
            LineSeries line1 = new LineSeries
            {
                Title = "A",
                Values = cv

            };
            seriesCollection.Add(line1);

举例A折线的添加

重点：这里的x坐标也就是在mapper里面对应到time的地方，录入的是0、1、2、3、4，但是最后显示的确实1月、2月、3月、4月、5月

做法是还要单独建立一个X Series，并给它添加Labels，这样一来你录入的0便会自动对应到X轴的第一个标签上可以是1月也可以是北京，上海，或者其他任何你希望显示的东西

主体的东西就这些了，如果对你有用，还请点个赞