基于mschart控件，绘制工控采集类曲线，可对图像进行缩放，拖动滚动条显示放大后的图像，并动态显示曲线上的数值点
在工控、采集、测试类项目中经常需要对采集接收回来的数据进行图像、曲线显示，本人在项目中经常要求进行曲线绘图，而最快的曲线绘制方式就是采用IDE自带的绘图插件，本将对VS自带的chart控件，绘制实时温度时间曲线或历史温度时间曲线进行简单介绍，不足之处请发邮件至376851329@指正。言归正传，下面开始说明具体步骤：
1、在VS IDE中创建WINFORM工程，并添加chart控件，并删除chart控件中初始化的serials类、ChartArea类、legneds类中初始化的一些serials,chartarea、legned的初始变量
2、利用代码初始化chart控件，现将chart控件命名为mychart；代码中将图像初始化为时间温度曲线类型，初始化代码如下：
//初始化Chart控件样式public void InitializeChart(){#region 设置图表的属性//图表的背景色myChart.BackColor = Color.FromArgb(211, 223, 240);//图表背景色的渐变方式myChart.BackGradientStyle = GradientStyle.TopBottom;//图表的边框颜色myChart.BorderlineColor = Color.FromArgb(26, 59, 105);//图表边框线条样式myChart.BorderlineDashStyle = ChartDashStyle.Solid;//图表边框线条宽度myChart.BorderlineWidth = 2;//图表边框的皮肤myChart.BorderSkin.SkinStyle = BorderSkinStyle.Emboss;#endregion#region 设置图表表头//图表表头Title title = new Title();//标题title.Text = "热敏曲线";//标题字体title.Font = new System.Drawing.Font("Microsoft Sans Serif", 12, FontStyle.Bold);//字体颜色title.ForeColor = Color.FromArgb(26, 59, 105);//标题阴影颜色title.ShadowColor = Color.FromArgb(32, 0, 0, 0);//标题阴影偏移量title.ShadowOffset = 3;//添加标题myChart.Titles.Add(title);#endregion#region 设置图表区域属性//图标区名字chartarea = new ChartArea("Default");//背景色chartarea.BackColor = Color.FromArgb(64, 165, 191, 228);//背景色渐变方式chartarea.BackGradientStyle = GradientStyle.LeftRight;//渐变和阴影的辅助背景色chartarea.BackSecondaryColor = Color.White;//边框颜色chartarea.BorderColor = Color.FromArgb(64, 64, 64, 64);//阴影颜色chartarea.ShadowColor = Color.Transparent;//设置X轴和Y轴的线条颜色与宽度chartarea.AxisX.LineColor = Color.FromArgb(64, 64, 64, 64);chartarea.AxisX.LineWidth = 1;chartarea.AxisY.LineColor = Color.FromArgb(64, 64, 64, 64);chartarea.AxisY.LineWidth = 1;//设置X轴Y轴标题chartarea.AxisX.Title = "时间";chartarea.AxisY.Title = "温度";//设置X轴的最小值为第一个点的X坐标值chartarea.AxisX.Minimum = DateTime.Now.ToOADate();//设置X轴的显示类型及显示方式chartarea.AxisX.Interval = 0; //设置为0表示由控件自动分配chartarea.AxisX.IntervalAutoMode = IntervalAutoMode.VariableCount;chartarea.AxisX.IntervalType = DateTimeIntervalType.Minutes;chartarea.AxisX.LabelStyle.IsStaggered = true;chartarea.AxisX.LabelStyle.Format = "yyyy-MM-dd HH:mm:ss";//设置文本角度//chartArea.AxisX.LabelStyle.Angle = 45;//设置文本自适应chartarea.AxisX.IsLabelAutoFit = true;//设置网格线的样式、颜色和宽度chartarea.AxisX.MajorGrid.LineDashStyle = ChartDashStyle.Dash;chartarea.AxisX.MajorGrid.LineWidth = 1;chartarea.AxisX.MajorGrid.LineColor = Color.FromArgb(64, 64, 64, 64);chartarea.AxisY.MajorGrid.LineDashStyle = ChartDashStyle.Dash;chartarea.AxisY.MajorGrid.LineWidth = 1;chartarea.AxisY.MajorGrid.LineColor = Color.FromArgb(64, 64, 64, 64);//设置绘图区域可以缩放 //chartarea.AxisX.ScrollBar.LineColor = System.Drawing.Color.Black; //设置滚动条在图像内还是在图像外//chartarea.AxisX.ScrollBar.Size = 10; //设置滚动条宽度大小chartarea.AxisX.ScrollBar.IsPositionedInside = false; //设置滚动条在图像内还是在图像外chartarea.AxisX.ScrollBar.Enabled = true;//chartarea.AxisX.ScrollBar.ButtonStyle = ScrollBarButtonStyles.ResetZoom;chartarea.AxisX.ScaleView.SmallScrollMinSize = 1;chartarea.AxisX.ScaleView.SmallScrollMinSizeType = DateTimeIntervalType.Seconds;//此项设置将可以采用MSChart图形中鼠标点击移动滚动条功能chartarea.CursorX.IsUserEnabled = true;chartarea.CursorX.IsUserSelectionEnabled = true;chartarea.CursorX.Interval = 0;chartarea.CursorX.IntervalOffset = 0;chartarea.CursorX.IntervalType = DateTimeIntervalType.Minutes;chartarea.AxisX.ScaleView.Zoomable = true;//启用用户缩放数据//添加绘图区域myChart.ChartAreas.Add(chartarea);#endregion#region 图例及曲线标签位置Legend legend = new Legend();legend.Alignment = StringAlignment.Center;legend.Docking = Docking.Right;//添加图例及曲线标签位置myChart.Legends.Add(legend);#endregion}
以上代码段中完成了对图像绘制区域的外观设置，以及曲线缩放功能设置
3、添加并设置曲线
//设置Series曲线样式public Series SetSeriesStytle(int i){//创建曲线plot_series[i] = new Series(string.Format("第{0}条数据", i + 1));//Series曲线类型plot_series[i].ChartType = SeriesChartType.Line;//设置Series的边框颜色plot_series[i].BorderColor = Color.FromArgb(180, 26, 59, 105);//设置Series曲线宽度plot_series[i].BorderWidth = 3;//设置线条阴影颜色plot_series[i].ShadowColor = Color.Black;//线条阴影宽度plot_series[i].ShadowOffset = 2;//是否显示阴影数据说明plot_series[i].IsVisibleInLegend = true;//线条上的数据点是否有数据显示plot_series[i].IsValueShownAsLabel = false;//线条上数据点的标志类型plot_series[i].MarkerStyle = MarkerStyle.None;//线条数据点大小plot_series[i].MarkerSize = 3;//线条颜色switch(i){case 0:plot_series[i].Color = Color.FromArgb(220, 65, 140, 240);plot_series[i].ChartType = SeriesChartType.StepLine;break;case 1:plot_series[i].Color = Color.FromArgb(220, 224, 64, 10);break;case 2:plot_series[i].Color = Color.FromArgb(220, 120, 150, 20);plot_series[i].ChartType = SeriesChartType.Stock;break;default:break;}return plot_series[i];}
4、在MainForm构造函数中添加初始化代码
public MainForm(){InitializeComponent();//初始化曲线this.SetSeriesStytle(0);this.SetSeriesStytle(1);this.SetSeriesStytle(2);//初始化数据data[0] = new float[1];data[1] = new float[1];data[2] = new float[1];//初始化chart控件样式InitializeChart();//界面加载函数this.Load += new EventHandler(MainForm_Load);//显示曲线上点的数据this.myChart.GetToolTipText += new EventHandler<ToolTipEventArgs>(myChart_GetToolTipText);}
5、添加以上设置消息响应函数实现
public void MainForm_Load(object sender, EventArgs e){DateTime dt = DateTime.Now;data[0][0] = 0;data[1][0] = 0;data[2][0] = 0;plot_series[0].Points.AddXY(dt, data[0][0]);this.myChart.Series.Add(plot_series[0]);plot_series[1].Points.AddXY(dt, data[1][0]);this.myChart.Series.Add(plot_series[1]);plot_series[2].Points.AddXY(dt, data[2][0]);this.myChart.Series.Add(plot_series[2]);timer_RealGraph.Enabled = true;}//显示曲线上的数值点public void myChart_GetToolTipText(object sender,ToolTipEventArgs e){if (e.HitTestResult.ChartElementType == ChartElementType.DataPoint){int i = e.HitTestResult.PointIndex;DataPoint dp = e.HitTestResult.Series.Points[i];e.Text = string.Format("时间:{0};数值:{1:F1} ", DateTime.FromOADate(dp.XValue), dp.YValues[0]);}}
6、添加定时器控件，实现动态曲线绘制
//实时动态绘图private void timer_RealGraph_Tick(object sender, EventArgs e){Random random = new Random();DateTime dt = DateTime.Now;for (int j = 0; j < 3; j++){data[j][0] = random.Next(-10, 10);plot_series[j].Points.AddXY(dt, data[j][0]);}while (plot_series[0].Points.Count > 1000){foreach (Series series in myChart.Series){series.Points.RemoveAt(0);}}chartarea.AxisX.Minimum = plot_series[0].Points[0].XValue;chartarea.AxisX.Maximum = DateTime.Now.ToUniversalTime().AddHours(10).ToOADate();myChart.Invalidate();}
总结：以上就是绘制温度时间动态曲线，并进型缩放的详细步骤，工程中是在定时器下进行绘制的，在线程中绘制是同样的道理，只需将定时器部分代码改为线程实现即可。
关键点：在进行缩放设置时，以下代码是关键部分，在msdn中都做了详细的说明，可以查看下msdn中的说明，我在代码中也做了详细注释，可供参考
chartarea.AxisX.ScrollBar.IsPositionedInside = false; //设置滚动条在图像内还是在图像外chartarea.AxisX.ScrollBar.Enabled = true;chartarea.AxisX.ScaleView.SmallScrollMinSize = 1;chartarea.AxisX.ScaleView.SmallScrollMinSizeType = DateTimeIntervalType.Seconds;//此项设置将可以采用MSChart图形中鼠标点击移动滚动条功能chartarea.CursorX.IsUserEnabled = true;chartarea.CursorX.IsUserSelectionEnabled = true;chartarea.CursorX.Interval = 0;chartarea.CursorX.IntervalOffset = 0;chartarea.CursorX.IntervalType = DateTimeIntervalType.Minutes; chartarea.AxisX.ScaleView.Zoomable = true;//启用用户缩放数据
此种方案绘制的温度时间采集曲线，可应用于大多数项目的需求，可以将代码直接应用于项目中，项目运行图片如下所示
最后附上工程源代码
如果觉得《基于mschart控件 绘制工控采集类曲线 可对图像进行缩放 拖动滚动条显示放大后的图像》对你有帮助，请点赞、收藏，并留下你的观点哦！
