Delphi的TCanvas类可以实现各种复杂的图形输出功能,基于近期项目的需求,利用它实现了一个很炫的动态折线图(模拟了资源管理器中CPU使用率的折线图),可以直观地展现出数值的实时变化情况。

这段代码里边有几个核心的地方:

  • 首先是为了缓解刷新时画布闪烁,利用了双缓冲的原理;
  • 其次结合队列,保证了数据的顺序压入;
  • 还有就是一些简单的数组算法。

最终的效果如下:

单元代码如下:

unit Unit1;interfaceusesWindows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,Dialogs, StdCtrls, ExtCtrls,Contnrs;const{* 网格间隔 *}GridSpace = 12;{* 移动步长(能够被间隔整除) *}MoveStep = 3;{* Y轴最大值(最大刻度) *}MaxY = 100;typeTForm1 = class(TForm)Timer1: TTimer;Button1: TButton;Image1: TImage;procedure DrawPL(Shower:TImage);procedure Timer1Timer(Sender: TObject);procedure FormCreate(Sender: TObject);procedure Button1Click(Sender: TObject);procedure FormShow(Sender: TObject);procedure FormDestroy(Sender: TObject);private{ Private declarations }public{ Public declarations }end;varForm1: TForm1;{* 网格竖线X坐标数组 *}GridXPArr: array of Integer;{* 点坐标数组 *}PointLst: array of TPoint;{* 数值队列 *}YPQueue: TQueue;{* 数值指针 *}PYValue: PInteger;{* 网格偏移量 *}X: Word;implementation{$R *.dfm}procedure TForm1.Button1Click(Sender: TObject);
varYValue:Integer;
beginRandomize;YValue := Random(100);//新Y坐标点按顺序压入队列
  New(PYValue);PYValue^ := YValue;YPQueue.Push(PYValue);
end;procedure TForm1.DrawPL(Shower:TImage);
varBit: TBitmap;i: Integer;PW,PH: Integer;YValue:Integer;
begin//偏移量计算
  Inc(X);if X = GridSpace div MoveStep thenX := 0;//初始化画布(双缓冲)Bit := TBitmap.Create;tryPW := Shower.Width;PH := Shower.Height;Bit.Width := PW;Bit.Height := PH;//初始化网格竖线X坐标数组长度为宽/间隔+1SetLength(GridXPArr,PW div GridSpace + 1);with Bit.Canvas dobeginBrush.Color := clBlack;Brush.Style := bsSolid;Rectangle(0,0,PW,PH);Pen.Color := $00408000;//画网格,根据偏移量实现动态效果for i := 0 to PW div GridSpace + 1 dobeginGridXPArr[i] := GridSpace * i - X * MoveStep;MoveTo(GridXPArr[i],0);LineTo(GridXPArr[i],PH);end;for i := 0 to PH div GridSpace dobeginMoveTo(0,GridSpace * i);LineTo(PW,GridSpace * i);end;//画折线Pen.Color := clLime;YValue := 0;//如果队列中有新的Y坐标点,则输出if YPQueue.Count > 0 thenbeginPYValue := YPQueue.Pop;YValue := PYValue^;Dispose(PYValue);end;//画笔移动到起点位置MoveTo(0,PH);//每执行一次函数,Y坐标向前移动一位,并连线各个点for i := 0 to Length(PointLst) - 2 dobeginPointLst[i].Y := PointLst[i + 1].Y;LineTo(PointLst[i+1].X,PointLst[i+1].Y);end;//按比例更新最后一位坐标点PointLst[Length(PointLst)-1].X := PW;PointLst[Length(PointLst)-1].Y := PH - (YValue  * PH div MaxY);//打印信息(可根据需要调整显示位置和内容)Brush.Style:=bsClear;Font.Color:=clYellow;TextOut(10,10,'数值:'+inttostr(YValue));end;Shower.Canvas.Draw(0,0,Bit);finallyBit.Free;end;
end;procedure TForm1.FormCreate(Sender: TObject);
vari:Integer;
beginYPQueue := TQueue.Create;//初始化坐标点个数为宽/步长+1SetLength(PointLst,Image1.Width div MoveStep + 1);//初始化坐标点为X轴基线位置for i := 0 to Length(PointLst) - 1 dobeginPointLst[i].X := i*MoveStep;PointLst[i].Y := Image1.Height;end;
end;procedure TForm1.FormDestroy(Sender: TObject);
beginYPQueue.Free;
end;procedure TForm1.FormShow(Sender: TObject);
beginDrawPL(Image1);
end;procedure TForm1.Timer1Timer(Sender: TObject);
beginDrawPL(Image1);
end;end.

转载于:https://www.cnblogs.com/chenmfly/p/4818328.html

模拟Windows任务管理器CPU使用率的动态折线图-农夫山泉相关推荐

  1. 动态折线图 python_python 怎么做个动态折线

    本文,用python调用matplotlib模块,画一个动态折线图. 工具/原料 电脑 python3.6(Anaconda) matplotlib模块 方法/步骤 1 先画一系列的折线图,代码如下图 ...

  2. Qt工作笔记-动态折线图(x轴坐标会改变)

    运行截图如下: 逻辑很简单,下面直接放代码: widget.h #ifndef WIDGET_H #define WIDGET_H#include <QWidget> #include & ...

  3. Android之绘制动态折线图

    所谓动态折线图,就是折线图能随着手指的滑动进行动态绘制,这里很定会产生动画效果.基于这个效果,这里使用SurfaceView进行制图. 实现步奏如下: (1): 这里新建一个绘图ChartView,继 ...

  4. [VUE2/VUE3]基于echarts的动态折线图组件

    [VUE2/VUE3]基于echarts的动态折线图组件 时间格式化代码 export default function formatSecond(value: number) {let millis ...

  5. 3分钟学会制作动态折线图!

    在进行数据报表综合分析对走势进行展示时,折线图的展示效果会更加清晰,而动态折线图则进一步增强了展示的效果,实现智能数据可视化. 上期为大家介绍了动态折线图在数据可视化平台的使用方法,这次向大家介绍一些 ...

  6. 动态折线图,制作原来是这么简单

    动态折线图,依据动态资料所绘制成的多角曲线图.通常用横轴代表时间,纵轴代表指标数值,每个时间与指标值形成坐标点,将各相邻两坐标点用直线相连,即构成动态折线图. 从上图得知,近一年汽油与柴油的价格总体呈 ...

  7. echarts动态折线图拉扯变形问题

    echarts动态折线图拉扯变形问题 在使用echarts折线图 做动态数据展示时,发现一个bug 当折线图的一个数值较高点紧挨着一个数值为零的点,guyong时图形会被拉扯,应该是echart的bu ...

  8. 迪赛智慧数——折线图(动态折线图):2001- 2020中国城镇收入、房价、GDP、通货增长对比

    效果图 中国城镇居民人均可支配收入增长迅速.从2001年的6824元到2020年的43834元,2020年与2001年相比增长近6倍,增速超过全国房价平均增速.从数据看整体收入增速是高于房价.CPI和 ...

  9. python plt 画动态折线图

    python plt 画动态折线图 # coding=utf-8import matplotlib.pyplot as plt import numpy as npdef main():plt_lis ...

最新文章

  1. 实时记录运动轨迹插件_智慧工地:“全能安全帽”自带WiFi 可实时拍摄通话
  2. 常用思科设备图标(JPG+矢量图)
  3. 机器学习及大数据经典算法笔记汇总
  4. qt opengl 2d绘图效率_Qt趣味开发之打造一个3D名字渲染小工具
  5. 基于微服务架构的门户平台改造的研究
  6. python 有限域函数库_有限域:计算矩阵的逆
  7. vue echarts 柱状图
  8. HCIE学习笔记(2)之ISIS Overload
  9. C++定义一个描述员工(Employee)基本情况的类
  10. 彼得林奇投资策略精髓
  11. 存储器的概述——DRAM动态存储器
  12. linux内核模块Makefile的解析
  13. python代码调试工具_我猜你需要这个Python调试工具
  14. 今天零晨的大雨好厉害呀
  15. 《局外人》活着活着就把自己活成了冷漠无情的局外人
  16. 微信小程序使用weapp-qrcode生成二维码
  17. 【错误】vs 应用程序无法正常启动0xc00007b
  18. 解决:Godaddy域名解析很慢,网站经常打不开或者解析失败
  19. 用C语言实现my_strncat
  20. [日记]夜色中的雪世界

热门文章

  1. 控制层@Value注解取不到值
  2. 《AutoCAD 2014中文版实用教程》一一2.2 圆类命令
  3. 也来学学插件式开发续-利用MEF
  4. Vue.js 条件渲染 v-if、v-show、v-else
  5. 生成32位字母数字的随机数
  6. jsp 中实现点击按钮 实现页面跳转到HTML
  7. 移动端测试===adb shell top命令解释
  8. 《算法图解》之散列表
  9. 每日Ubuntu小技巧 - 在Ubuntu上面安装VMware Workstation
  10. Spring WS Consume Soap Service From WSDL