VB中实时曲线的绘制

VB中实时曲线的绘制在工控制软件中，实时曲线的绘制用途非常的广泛，它可以很直观的显示出监控数据的变化值和变化趋势。在VB中实现曲线的绘制有很多种方法，本文介绍一种非常简单的方法来实现实时曲线的绘制。在VB中实现实时曲线的绘制，要利用VB的PictureBox（图像）控件，和画线函数line(x1,y1)-(x2,y2)。PictureBox控件，可以作为一个“容器”，在它的里面可以包含很多的对象。也可以执行很多VB的内部函数。要实现实时曲线的绘制，肯定要有外部实时数据的输入，这里假设是有一个数据从计算机的串口输入定义该数据变量为DataFromCom。实时曲线反映的就是该数据。打开VB6.0中文版，新建一个项目和窗体，修改窗体的属性，将“Heigh”修改为：8000，“Width”修改为在窗体中放如一个PictureBox控件。然后重新定义PictureBox控件的一些基本属性，在VB中选中PictureBox控件，直接在它的属性框中，修改一些属性参数。“名称”改为Pic。“AutoRedraw”改为：True。“BackColor”改为：&H00004000&（墨绿色背景颜色）。”Heigh”改为：5000。“Width”改为：8000。如图1所示：然后要重新定义PictureBox控件的坐标系。图像框的默认坐标系，是从左上角开始的，不符合我们的画线要求。修改坐标系的目的是让曲线从图像框的左边正中间，开始画线。修改图像框的坐标系，这里定义一个过程PicScale(),代码如下：PrivateSubPicScale(picXAsPictureBox)picX.Scale(0,PicX.ScaleHeight)-(picX.ScaleWidth,-PicX.ScaleHeight)EndSub一般的实时曲线显示的时候在屏幕的正中间有一条基准线，这里也要画出这条基准线，用一个过程PicMidleLine()来实现,代码如下：PrivateSubPicMidleLine(picXAsPictureBox)picX.Line(0,0)-(picX.ScaleWidth,0),vbGreen'画出中线EndSub要画一条实时曲线，坐标轴的设定很重要，在这里把X轴设定为时间轴，Y轴设定为数据轴。对应X轴我们定义一个时间变量TimeCount,TimeCount会随着时间逐渐递增，每次递增，对应着一个从串口读过来的数据DataFromCom，这样图像框中的（x,y）坐标点实际上就对应着（TimeCount,DataFromCom）如果只是当TimeCount发生变化时就在图像框上画一个点，就只需调用VB中的画像素的函数point(x,y)，这里x,y为所画的点的坐标。单这样画出来的是一个个不连续的点。我们想要的是实时的连续的曲线，所以要调用VB中的画线的函数line(x1,y1)-(x2,y2)，这里（x1,y1）(x2,y2)为所要画的线的起点和终点的坐标。只要把上次串口读过来的数据（这里把它定义为变量DataFromComLast）和现在串口读过来的数据(DataFromCom)和TimeCount相对应，调用line(x1,y1)-(x2,y2)函数就可以在图像框中画出实时的曲线了。把它写成一个过程如下面的代码：PrivateSubDrawRealLine(picXAsPictureBox,TimeCountXAsInteger,DataFromComXAsInteger,DataFromComLastXAsInteger)IfTimeCountX-10ThenpicX.Line(TimeCountX-1,DataFromComLastX)-(TimeCountX,DataFromComX),vbWhiteEndIfEndSub有了三个过程就可以在图像框中画出一条实时的曲线了。DrawRealLine()过程中的picX.Line(TimeCountX-1,DataFromComLastX)-(TimeCountX,DataFromComX),vbWhite所画线的起始点和结束点都是以像素为单位的，这样以来如果不改变的话，画出来的线将是一个屏幕上像素相连的很密的曲线，通过调整line(x1,y1)-(x2,y2)中的x的值，就可以画出分布密度不一样的曲线，这里为了在屏幕上能够看到不是很密的曲线我们把x乘以一个系数10，修改为：picX.Line((TimeCountX-1)*10,DataFromComLastX)-(TimeCountX*10,DataFromComX),vbWhite这比较容易在屏幕上看到稀疏的曲线。由于是仅仅讲解如何画出实时的曲线，读者的计算机上未必有和串口相连的设备，这里用一个定时器控件来模拟从串口读过来的数据。在窗体上放入一个Timer控件，修改Timer控件的属性为：“Enable”该为True，“Interval”改为300。双击Timer控件在它的过程中，添加代码后如下：PrivateSubTimer1_Timer()DataFromComLast=DataFromComRandomizeDataFromCom=3000*RndTimeCount=TimeCount+1DrawRealLinePic,TimeCount,DataFromCom,DataFromComLastEndSub这样在运行后就可以看到我们想要的实时曲线了，如下图：图2下面是完整的代码：OptionExplicitDimDataFromComAsInteger'从串口读过来的实时值DimDataFromComLastAsInteger'上次的串口值DimTimeCountAsIntegerPrivateSubForm_Load()PicScalePic'调整图像框的坐标系PicMidleLinePic'在图像框中画一条中线EndSubPrivateSubPicScale(picXAsPictureBox)'调整图像框的坐标系picX.Scale(0,picX.ScaleHeight)-(picX.ScaleWidth,-picX.ScaleHeight)EndSubPrivateSubPicMidleLine(picXAsPictureBox)'在图像框中画一条中线picX.Line(0,0)-(picX.ScaleWidth,0),vbGreen'画出中线EndSubPrivateSubDrawRealLine(picXAsPictureBox,TimeCountXAsInteger,DataFromComXAsInteger,DataFromComLastXAsInteger)IfTimeCountX-10ThenpicX.Line((TimeCountX-1)*10,DataFromComLastX)-(TimeCountX*10,DataFromComX),vbWhiteEndIfEndSubPrivateSubTimer1_Timer()DataFromComLast=DataFromComRandomizeDataFromCom=3000*RndTimeCount=TimeCount+1DrawRealLinePic,TimeCount,DataFromCom,DataFromComLast'画出实时的曲线EndSub