Qt之QCustomPlot(图形库)

简介: 简述QCustomPlot是一个基于Qt C++的图形库,用于绘制和数据可视化 - 制作漂亮的2D图 - 曲线图、趋势图、坐标图、柱状图等,并为实时可视化应用程序提供高性能服务。它没有进一步的依赖关系,并有着良好的文档记录。QCustomPlot可以导出为各种格式,比如:PDF文件和位图(如:PNG、JPG、BMP)。可在自己的项目中直接使用两个源文件(qcust

简述

QCustomPlot是一个基于Qt C++的图形库,用于绘制和数据可视化 - 制作漂亮的2D图 - 曲线图、趋势图、坐标图、柱状图等,并为实时可视化应用程序提供高性能服务。它没有进一步的依赖关系,并有着良好的文档记录。

QCustomPlot可以导出为各种格式,比如:PDF文件和位图(如:PNG、JPG、BMP)。

可在自己的项目中直接使用两个源文件(qcustomplot.h与qcustomplot.cpp),或预先编译成库。

下载

QCustomPlot首页:http://www.qcustomplot.com/

进入QCustomPlot下载页,下载最新的完整包(包含:源码、文档、示例)!

这里写图片描述

将下载好的安装包进行解压缩,里面包含文档、示例、更改日志、GPL授权、以及最重要的两个文件qcustomplot.h与qcustomplot.cpp。

配置

文档

完整的API文档在complete API documentation上面,或者作为完整包的一部分,在解压缩后的目录中可以找到。里面包含一个HTML文档的层次结构和qch帮助文件用于QtCreator/Assistant集成。如果使用QtCreator或Assistant,应考虑使用qch文件,这将极大地提高工作效率!

集成到QtCreator/Assistant

集成qch文件相当简单:

  1. 复制qcustomplot.qch文件到你需要存储的地方(例如:本地QtCreator配置目录)。

  2. 在QtCreator中,选择:工具 -> 选项 -> 帮助 -> 文档,你会看到一个加载文档模块的列表,以及添加/删除模块的按钮。点击”添加…”按钮,选择qcustomplot.qch文件。

这样,我们就添加完成了。可以通过:帮助 -> 索引,来搜索QCustomPlot相关的类或函数。

当你把光标放在任何QCustomPlot相关的类或函数上时,按下F1键,就会有相应的文档项弹出,就像Qt组件一样。

使用

在examples中我们会看到一些自带的示例,可以运行看一下效果。

如果在自己的项目中使用,需要进行以下配置:

首先,在pro中需要添加(由于QCustomPlot中存在导出功能,使用了printsupport模块):

QT += printsupport

然后,将qcustomplot.h与qcustomplot.cpp拷贝到工程目录下,右键 -> 添加现有文件…,将这两个文件添加至工程。

下面,我们来实现一个曲线图,为了增强效果,我们设置一些样式。

效果

这里写图片描述

源码

#include "qcustomplot.h"

MainWindow::MainWindow(QWidget *parent)
    : CustomWindow(parent)
{
    ...

    QCustomPlot *pCustomPlot = new QCustomPlot(this);
    pCustomPlot->resize(300, 300);

    // 可变数组存放绘图的坐标的数据,分别存放x和y坐标的数据,101为数据长度
    QVector<double> x(101), y(101);

    // 添加数据,这里演示y = x^3,为了正负对称,x从-10到+10
    for (int i = 0; i < 101; ++i)
    {
        x[i] = i/5 - 10;
        y[i] = qPow(x[i], 3);  // x的y次方;
    }

    // 向绘图区域QCustomPlot添加一条曲线
    QCPGraph *pGraph = pCustomPlot->addGraph();

    // 添加数据
    pCustomPlot->graph(0)->setData(x, y);

    // 设置坐标轴名称
    pCustomPlot->xAxis->setLabel("x");
    pCustomPlot->yAxis->setLabel("y");

    // 设置背景色
    pCustomPlot->setBackground(QColor(50, 50, 50));

    pGraph->setPen(QPen(QColor(32, 178, 170)));

    // 设置x/y轴文本色、轴线色、字体等
    pCustomPlot->xAxis->setTickLabelColor(Qt::white);
    pCustomPlot->xAxis->setLabelColor(QColor(0, 160, 230));
    pCustomPlot->xAxis->setBasePen(QPen(QColor(32, 178, 170)));
    pCustomPlot->xAxis->setTickPen(QPen(QColor(128, 0, 255)));
    pCustomPlot->xAxis->setSubTickPen(QColor(255, 165, 0));
    QFont xFont = pCustomPlot->xAxis->labelFont();
    xFont.setPixelSize(20);
    pCustomPlot->xAxis->setLabelFont(xFont);

    pCustomPlot->yAxis->setTickLabelColor(Qt::white);
    pCustomPlot->yAxis->setLabelColor(QColor(0, 160, 230));
    pCustomPlot->yAxis->setBasePen(QPen(QColor(32, 178, 170)));
    pCustomPlot->yAxis->setTickPen(QPen(QColor(128, 0, 255)));
    pCustomPlot->yAxis->setSubTickPen(QColor(255, 165, 0));
    QFont yFont = pCustomPlot->yAxis->labelFont();
    yFont.setPixelSize(20);
    pCustomPlot->yAxis->setLabelFont(yFont);

    // 设置坐标轴显示范围,否则只能看到默认范围
    pCustomPlot->xAxis->setRange(-11, 11);
    pCustomPlot->yAxis->setRange(-1100, 1100);

    ...
}

如果需要导出,我们可以调用对应的save…接口。

例如,导出一张为PNG格式,宽度、宽度分别为400px、300px的图片:

pCustomPlot->savePng("customPlot.png", 400, 300);

截图

下面的截图显示了QCustomPlot实现的一些效果,仅仅通过很少的代码而已。要查看代码,可以进入:QCustomPlot首页,然后点击相应的图片即可。所有可用代码也可以在完整包中找到,导航到:examples/plots/plot-examples.pro。

这里写图片描述这里写图片描述这里写图片描述
这里写图片描述这里写图片描述这里写图片描述
这里写图片描述这里写图片描述这里写图片描述
这里写图片描述这里写图片描述这里写图片描述
这里写图片描述这里写图片描述这里写图片描述

目录
相关文章
|
1月前
|
存储
QT图形视图框架绘制曲线图和Smith图
QT图形视图框架绘制曲线图和Smith图
17 0
|
23天前
|
数据可视化 图形学 开发者
【Qt 底层机制之图形渲染引擎】深入理解 Qt 的 渲染机制:从基础渲染到高级图形
【Qt 底层机制之图形渲染引擎】深入理解 Qt 的 渲染机制:从基础渲染到高级图形
146 4
|
17天前
|
存储
Qt更新组件出现(“要继续此操作,至少需要一个有效且已启用的储存库”)
Qt更新组件出现(“要继续此操作,至少需要一个有效且已启用的储存库”)
Qt更新组件出现(“要继续此操作,至少需要一个有效且已启用的储存库”)
|
30天前
|
算法 API C++
Qt框架与STL库之间的巅峰对决:差异、优缺点及适用场景
Qt框架与STL库之间的巅峰对决:差异、优缺点及适用场景
116 0
|
5月前
|
C++
《QT从基础到进阶·二十六》绘制多个图形项(QGraphicsRectItem,QGraphicsLineItem,QGraphicsPolygonItem)
《QT从基础到进阶·二十六》绘制多个图形项(QGraphicsRectItem,QGraphicsLineItem,QGraphicsPolygonItem)
84 0
|
1月前
|
编解码 供应链 开发工具
英飞凌采用Qt图形解决方案增强Traveo T2G MCU系列,实现智能渲染技术
在竞争激烈的全球半导体市场,制造商一直在努力缩短产品上市时间。同时,他们对流畅、高分辨率图形显示器的需求也在日益增长。
|
4月前
|
存储 JSON JavaScript
[Qt5] QJson库进行存储、加载数据
[Qt5] QJson库进行存储、加载数据
21 0
|
4月前
|
存储 数据可视化 测试技术
[Qt5] QGraphics图形视图框架概述(Item、Scene和View)
[Qt5] QGraphics图形视图框架概述(Item、Scene和View)
134 0
|
4月前
|
C++
[项目配置] 配置Qt函数库和ui界面库的封装并调用的项目(二)
[项目配置] 配置Qt函数库和ui界面库的封装并调用的项目
42 0
|
4月前
|
算法 关系型数据库 编译器
[项目配置] 配置Qt函数库和ui界面库的封装并调用的项目(一)
[项目配置] 配置Qt函数库和ui界面库的封装并调用的项目
68 0

推荐镜像

更多