开源图表控件ScottPlot的学习记录
包含曲线自由移动、缩放、显隐
及标记轴线、十字准线功能
github.com/ScottPlot/ScottPlot
后台回复代码，获取下载链接
概述
最近领导安排搞一个上位机，并推荐使用葡萄城的C1Chart绘制图表。零基础的我用着实属难受，文档也不友好：
搜索引擎告诉我ScottPlot是一款不错的开源控件：
开发帮助文档
文档地址：scottplot.net/cookbook/4.1/
入门文档相当舒服，效果图 + 源代码进行讲解
控件安装步骤
新建一个WPF的解决方案
资源管理器右键解决方案，打开NuGet包管理器
或者菜单栏，点击>项目，点击>NuGet程序包
搜索“ScottPlot”，安装“ScottPlot”、“ScottPlot.WPF”
安装失败，需右键>解决方案，选择>属性，更改目标框架为最新的“V4.7.2”
安装成功，工具箱会显示“WpfPlot”的控件
窗体布置WpfPlot
这里使用WPF开发，窗体使用XAML描述，与HTML设计类似，熟悉网页开发的朋友很容易上手。
下图皆是创建解决方案自动生成的代码：
先增加一个主窗体加载的事件
接着在“Grid”容器中添加如下代码：
<Grid.RowDefinitions><RowDefinition Height="15"/><RowDefinition Height="383*"/></Grid.RowDefinitions><WpfPlot Name="wpfPlot" Grid.Row="1" MouseEnter="wpfPlot_MouseEnter" MouseLeave="wpfPlot_MouseLeave" MouseMove="wpfPlot_MouseMove"/><CheckBox x:Name="plot1" Content="曲线1" Click="plot2_Click" IsChecked="True"/><CheckBox x:Name="plot2" Content="曲线2" Margin="80,0,0,0" Click="plot2_Click" IsChecked="True"/>
放置两个CheckBox复选框，绑定一个单击事件，用于曲线的显隐
放置一个WpfPlot图表控件，绑定3个鼠标事件（实现十字准线）
编辑主窗体加载的代码
加载时，即创建了两条曲线：
private void Window_Loaded(object sender, RoutedEventArgs e){double[] X = new double[1024];double[] Y = new double[1024];double[] X1 = new double[1024];double[] Y1 = new double[1024];for (int i = 0; i < 1024; i++){X[i] = i;X1[i] = i;Y[i] = 1.9 * Math.Sin(i * 0.01);Y1[i] = 3 * Math.Sin(i * 0.03 + 2.5 * 3.14);}var plt = wpfPlot.Plot;plt.Clear(); //先清空图表plt.Title("标题：曲线测试");plt.XLabel("X轴：时间ms");plt.YLabel("Y轴：电压mV");plt.AddScatter(X, Y, label: "曲线1");plt.AddScatter(X1, Y1, label: "曲线2");//曲线的图例配置var legend = plt.Legend(true, ScottPlot.Alignment.UpperCenter);//顶部居中legend.Orientation = ScottPlot.Orientation.Horizontal; //横向排列legend.FontColor = System.Drawing.Color.White; //白色文字legend.FillColor = System.Drawing.Color.Transparent; //透明legend.OutlineColor = System.Drawing.Color.Transparent; //透明legend.ShadowColor = System.Drawing.Color.Transparent; //透明//图表背景色plt.Style(ScottPlot.Style.Blue2);//横向的轴线，投向Y轴var hLine = plt.AddHorizontalLine(2); //对应Y坐标点hLine.DragEnabled = true; //使能拖动hLine.DragLimitMin = -10; //位置限制hLine.DragLimitMax = 100;hLine.PositionLabel = true; //标记坐标数值hLine.PositionLabelBackground = hLine.Color; //标记的背景色//竖向的轴线，同上var vLine = plt.AddVerticalLine(3);vLine.DragEnabled = true;vLine.DragLimitMin = -10;vLine.DragLimitMax = 50;vLine.PositionLabel = true;vLine.PositionLabelBackground = vLine.Color;//X轴线标记的数值格式，小数点后1位Func<double, string> xFormatter = x => $"X={x:F1}";vLine.PositionFormatter = xFormatter;//绑定十字准线Crosshair = plt.AddCrosshair(5, 5);//更新图表wpfPlot.Refresh();}
实现十字准线
利用WpfPlot的“MouseMove”事件，实现该功能：
private void wpfPlot_MouseMove(object sender, MouseEventArgs e){ValueTuple<double, double> mouseCoordinates = this.wpfPlot.GetMouseCoordinates();double coordinateX = mouseCoordinates.Item1;double coordinateY = mouseCoordinates.Item2;Crosshair.X = coordinateX;Crosshair.Y = coordinateY;wpfPlot.Refresh();}
搭配复选框实现曲线隐藏
根据复选框是否选中，决定曲线显示/隐藏：
private void plot2_Click(object sender, RoutedEventArgs e){CheckBox checkbox = (CheckBox)sender;var plottables = wpfPlot.Plot.GetPlottables();if (checkbox == plot2)plottables[1].IsVisible = (bool)checkbox.IsChecked;elseplottables[0].IsVisible = (bool)checkbox.IsChecked;wpfPlot.Refresh();}
若绑定曲线的数据时，其返回值赋给了“series1 ”，那么通过设置series1 的IsVisible为false，即可隐藏曲线：
var series1 = plt.AddScatter(X, Y, label: "曲线1");series1.IsVisible = false;
演示
按下左键移动曲线
按下右键并移动，缩放曲线
横向移动，X轴缩放
竖向移动，Y轴缩放
滚轮等比例缩放
按下滚轮移动，放大选中的曲线段
官方Demo
下载地址：https://scottplot.net/demo/
界面如下，可以当作帮助文档：
-END-
