WPF oxyPlot 使用总结

　　oxyPlot能够简易的创建图表并且该库也在Github上面开源直通门。以下是笔者基础使用总结。本文例子的源码下载

1、安装与引用

　　新建一个wpf应用程序，然后使用Nuget控制台安装OxyPlot和OxyPlot.wpf直接键入。

Install-Package Oxyplot
Install-Package Oxyplot.Wpf

　　你也可以在应用程序-->“引用”-->"右键"-->"管理Nuget包"进行检索oxyplot关键字，可以看到相应的类库引用。（吐槽下：Nuget访问很慢）

　　你也可以直接通过上面的直通门去下载最新的源码自己编译。

到此，已经将Oxyplot的类库引用到指定的应用程序上。

2、 创建PlotViewModel简易画曲线

　　在OxyPlot内部可以通过Serial进行定义图表，包含：LineSerial（线条--可以通过定义点进行画线条）、FunctionSerial（函数曲线）、AreaSerial（区域）、StairSerial等，笔者就只用到前两者。

　　接下来实现一个画直线以及sin(x)的函数线的例子进行说明。

　　在PlotViewModel内部添加SimplePlotModel属性（类型：PlotModel），并且在PlotViewMode构造函数内部进行实例化，同时将定义好的直线以及sin(x)函数线添加该属性上。在MainWindow.xaml进行定义PlotView标签，同时绑定SimplePlotModel。具体的实现如下代码

PlotViewModel构造函数

public PlotViewModel()
{
SimplePlotModel=new PlotModel();
//线条
var lineSerial = new LineSeries() {  Title="直线实例"};
lineSerial.Points.Add(new DataPoint(0, 0));
lineSerial.Points.Add(new DataPoint(10, 10));
SimplePlotModel.Series.Add(lineSerial);

//函数sin(x)
var funcSerial = new FunctionSeries((x) => { return Math.Sin(x); }, 0, 10, 0.1, "y=sin(x)");
SimplePlotModel.Series.Add(funcSerial);
}

MainWindow.xmal

　　<Grid>
<oxy:PlotView Model="{Binding Path= SimplePlotModel}"></oxy:PlotView>

</Grid>

　　/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
private PlotViewModel _viewModel;

public MainWindow()
{
InitializeComponent();
_viewModel = new PlotViewModel();
//画直线
this.DataContext = _viewModel;
}
}

　　将会得到如下图所示的图标



3、定制坐标轴

在OxyPlot可以通过Axes进行自定义坐标轴，其中包含了LinearAxis、DateAxis、LogarithmicAxis、 CategoryAxis等比较实用的坐标轴

我们可以直接定义一个LinearAxis进行定义X、Y轴从0开始，最大10，如下例举比较常用的坐标轴属性（PS:x轴的设置想类似），效果如下图所示

//定义y轴
LinearAxis leftAxis = new LinearAxis()
{
Position=AxisPosition.Left,
Minimum=0,
Maximum=10,
Title = "Y轴",//显示标题内容
TitlePosition = 1,//显示标题位置
TitleColor = OxyColor.Parse("#d3d3d3"),//显示标题位置
IsZoomEnabled = false,//坐标轴缩放关闭
IsPanEnabled = false,//图表缩放功能关闭
//MajorGridlineStyle = LineStyle.Solid,//主刻度设置格网
//MajorGridlineColor = OxyColor.Parse("#7379a0"),
//MinorGridlineStyle = LineStyle.Dot,//子刻度设置格网样式
//MinorGridlineColor = OxyColor.Parse("#666b8d")
};

4、实时动态添加曲线

现实当中我们比较常用的实时获取数据生成曲线，所以我们可以通过调用SimplePlotModel.InvalidatePlot(true)进行刷新xmal上的图像。笔者只以简单的直线添加点进行动态生成线条，相应的代码如下所示：

　　　　　　var rd = new Random();
Task.Factory.StartNew(() =>
{
while (true)
{
var x = rd.NextDouble() * 1000 % 10;
var y = rd.NextDouble() * 50 % 9;
lineSerial.Points.Add(new DataPoint(x, y));
SimplePlotModel.InvalidatePlot(true);
Thread.Sleep(500);
}
});

5、本文例子的源码下载

源码 (如果觉得不错请点赞下，有误的话请指出，卤鸽在此感谢）

参考材料