Qt实时波形绘图（使用QCustomPlot）

目录

前言

一、Qt是什么？

二、QCustomPlot是什么？

三、Qt实时波形绘图

        3.1 开发环境和工具

        3.2 实时波形绘图控件

3.2.1 界面设计及功能

3.2.2 如何使用该控件

总结

---

前言

        我们在涉及或调试设备时，通常需要查看过程数据，以便了解设备的运行情况。我们可以把原始数据通过某种接口打印到电脑或其它载体上进行查看，但这样不直观，或需要更进一步的处理才能发现规律。如果我们能够将获取的数据以实时波形的形式显示在眼前，则对设备的各项运行情况一目了然，所以有经验的研发人员往往会自己做出一套用于调试的上位机，能够直观地显示各种数据、波形，进而做出分析。

         对于初学者而言，想要及时地做出一套上位机或实时波形显示界面，还是存在一定难度的，为了降低初学者的学习难度，亦方便其他研发人员的使用，我分享一套使用简单、功能强大的实时波形绘制控件，其基于Qt5与QCustomPlot实现。

---

一、Qt是什么？

        Qt是当下最流行的C++开发库，也是当下最流行的跨平台开发框架之一，可开发桌面端应用、移动端应用以及嵌入式端应用，可以说能支持的系统基本都支持，它可以做GUI但功能远不止GUI。我们用的最多的还是桌面端和嵌入式端的应用，移动端应用流行度不高。

        Qt涉及一整套开发流程，具有专业的全流程开发工具，如Qt Creator IDE、Qt Designer、Qt Design Studio，使用Qt可以快速高效地开发出自己想要的界面应用或控制台程序，满足研究、学习、生产需要。

        Qt官网：Qt | Cross-platform Software Design and Development Tools

二、QCustomPlot是什么？

        QCustomPlot是一个用于绘图和数据可视化的 Qt C++ 小部件。它不需要过多的依赖并且有详细的教程。QCustomPlot做出的图形或图表不仅美观，而且高性能，具有比任何其它绘图控件都要高的实时性。QCustomPlot 可以导出各种格式，如矢量化 PDF 文件和图像，如 PNG、JPG 和 BMP。

        经过本人实测，QCustomPlot绘制的波形或图表比Qt官方自带的绘图控件QChart性能要高，尤其是在具有大数据量高实时性的场合。

         QCustomPlot官网：Qt Plotting Widget QCustomPlot - Introduction，其官网实例如下，仅展示部分图片：

 三、Qt实时波形绘图

3.1 开发环境和工具

       我所使用的开发环境如下：

        Qt 5.14.2（包含对应的Qt Creator）；Qt5的其它版本理论上都支持；

        QCustomPlot 2.1.0；

        适用于Qt所支持的所有桌面平台。

3.2 实时波形绘图控件

3.2.1 界面设计及功能

        我用定时器生成了三条波形，分别是正弦波、矩形波和随机数，勾选右边的波形名称的勾选框可显示或隐藏波形曲线。点击波形名称后面的颜色按钮，可以任意更换波形颜色。功能展示如下：

        总结一下，功能如下：

        ① 自适应量程：根据数据的大小自动改变绘图坐标量程，使曲线的纵坐标全部显示在绘图区域；

        ② 全程：将曲线的横坐标和纵坐标全部显示在绘图区域；

        ③ 显示子网格：显示绘图区域的子网格；

        ④ 时间轴：设置绘图区域的时间轴大小，如设置10s，则绘图区域只显示出10s内的波形；

        ⑤ 清除：清除全部波形及数据；

        ⑥ 整图：当绘图暂停或停止接收数据时，点击该按钮，绘图区域显示波形的全部曲线；

        ⑦ 保存：将可视的绘图区域保存成png格式图片；

        ⑧ 暂停（开始）：暂停或开始波形绘制。

        在不勾选“自适应量程”和“全程”的情况下，鼠标可以对波形进行操作：鼠标滚轮缩放曲线大小，鼠标左键移动波形。

3.2.2 如何使用该控件

        该控件的源码我已经上传到CSDN上，地址：https://download.csdn.net/download/weixin_47488212/87606349

        源码中有个名为WidgetPlot2D的UI类，对应三个文件为widgetplot2d.cpp、widgetplot2d.h、widgetplot2d.ui，当然，在项目中必须包含QCustomPlot相关文件，我这里是直接包含qcustomplot.cpp、qcustomplot.h两个文件。另外在项目的.pro中，必须包含以下这句：

        QT += widgets printsupport

        可以使用代码直接实例化WidgetPlot2D，或通过窗口提升，然后使用WidgetPlot2D绘制实时波形只需两步：

        ① 初始化波形名称：函数initGraphName(QStringList)

        ② 给对应的波形添加数据：函数addData(QString, double)

        注意：波形名称和数据要一一对应，函数addData为公有槽函数，也可使用信号槽传递波形数据。

        其它更具体的操作可以查看源码，，喜欢的就给个赞吧！

---

总结

        本文简单介绍了Qt和QCustomPlot ，然后介绍了实时波形绘图控件，并给出了使用方法。