#QT# QCustomPlot-技术圈

-Start：关注本公众号后，可直接联系后台获取排版美化的详细文档！

-Hints：本篇文章所编纂的资料均来自网络，特此感谢参与奉献的有关人员。

QCustomPlot

QCustomPlot是Qt的一个小型第三方图表库，支持静态/动态曲线、柱状图、蜡烛图、频谱图等。

QCustomPlot 使用

-下载链接：

https://www.qcustomplot.com/index.php/download

-新建项目

使用Qtcreator新建一个工程，基类模板选择QMainWindow

-复制qcustomplot

将解压得到的QCustompPlot文件夹里面的头文件qcustomplot.h和源文件qcustomplot.cpp复制粘贴到工程文件夹下。

QCustomPlot的几个重要类

-QCustomPlot 图表类：用于图表的显示和交互

-QCPLayer 图层：管理图层元素（QCPLayerable），所有可显示的对象都是继承自图层元素

-QCPAbstractPlottable 绘图元素：包含折线图(QCPGraph)、曲线图(QCPCurve)、柱状图(QCPBars)、QCPStatiBox(盒子图)、QCPColorMap(色谱图)、QCPFinancial(金融图)

-QCPAxisRect 坐标轴矩形：一个坐标轴矩形默认包含上下左右四个坐标轴，但是可以添加多个坐标轴

QCustomPlot类

QCustomPlot类管理着所有的图层，它默认自带了六个图层，分别是：

1背景层background

2网格层grid

3绘图层main

4坐标轴层axes

5图例层legend

6 overlay层overlay

依据层的顺序的不同，绘制的顺序也不同，越在底下的层越早绘制，当前层默认为绘图层main

我们的绘图区域则在QCPAxisRect中，QCustomPlot类默认包含一个QCPAxisRect，我们可以在下图中可以看到一个QCPAxisRect一般来说会有上轴xAxis2、下轴xAxis、左轴yAxis和右轴yAxis2四个轴

QCustomPlot 静态示例

-主要函数

voidMainWindow::setupQuadraticDemo(QCustomPlot *customPlot)

{

QVector x(101), y(101);

for (int i = 0; i < 101; ++i) {

x[i] = i / 50.0 - 1; // -1 到 1

y[i] = x[i] * x[i];

}

customPlot->addGraph(); // 添加一个曲线图QGraph

customPlot->graph(0)->setData(x, y); // 为曲线图添加数据

customPlot->graph(0)->setName("第一个示例"); // 设置曲线图的名字

customPlot->xAxis->setLabel("x"); // 设置x轴的标签

customPlot->yAxis->setLabel("y");

customPlot->xAxis->setRange(-1, 1); // 设置x轴的范围为(-1,1)

customPlot->yAxis->setRange(0, 1);

customPlot->legend->setVisible(true); // 显示图例

}

-示例效果

QCustomPlot 动态示例

mainwindow.h代码如下：

#ifndef MAINWINDOW_H

#define MAINWINDOW_H

#include

#include "qcustomplot.h"

namespace Ui {

class MainWindow;

}

class MainWindow : public QMainWindow

{

Q_OBJECT

public:

explicit MainWindow(QWidget *parent = 0);

~MainWindow();

//设置qcustomplot画图属性，实时

void setupRealtimeDataDemo(QCustomPlot *customPlot);

private slots:

//添加实时数据槽

void realtimeDataSlot();

private:

Ui::MainWindow *ui;

//定时器，周期调用realtimeDataSlot()槽，实现动态数据添加到曲线

QTimer dataTimer;

};

#endif // MAINWINDOW_H

mainwindow.cpp代码如下：

#include "mainwindow.h"

#include "ui_mainwindow.h"

#include

MainWindow::MainWindow(QWidget *parent) :

QMainWindow(parent),

ui(new Ui::MainWindow)

{

ui->setupUi(this);

setupRealtimeDataDemo(ui->customPlot);

ui->customPlot->replot();

ui->checkBox_temp->setChecked(true);

ui->checkBox_hui->setChecked(true);

}

MainWindow::~MainWindow()

{

delete ui;

}

//画图初始化

void MainWindow::setupRealtimeDataDemo(QCustomPlot *customPlot)

{

//#if QT_VERSION < QT_VERSION_CHECK(4, 7, 0)

//QMessageBox::critical(this, "", "You're using Qt <4.7, the realtime data demo needs functions that are available with Qt 4.7 towork properly");

//#endif

//demoName = "Real Time Data Demo";

// include this section to fully disable antialiasing for higherperformance:

customPlot->setNotAntialiasedElements(QCP::aeAll);

QFont font;

font.setStyleStrategy(QFont::NoAntialias);

customPlot->xAxis->setTickLabelFont(font);

customPlot->yAxis->setTickLabelFont(font);

customPlot->legend->setFont(font);

customPlot->addGraph(); // blue line

customPlot->graph(0)->setPen(QPen(Qt::blue));

customPlot->graph(0)->setName("temp");

//customPlot->graph(0)->setBrush(QBrush(QColor(240, 255, 200)));

//customPlot->graph(0)->setAntialiasedFill(false);

customPlot->addGraph(); // red line

customPlot->graph(1)->setPen(QPen(Qt::red));

customPlot->graph(1)->setName("hui");

//customPlot->graph(0)->setChannelFillGraph(customPlot->graph(1));

customPlot->xAxis->setTickLabelType(QCPAxis::ltDateTime);

customPlot->xAxis->setDateTimeFormat("hh:mm:ss");

customPlot->xAxis->setAutoTickStep(false);

customPlot->xAxis->setTickStep(2);

customPlot->axisRect()->setupFullAxesBox();

// make left and bottom axes transfer their ranges to right and topaxes:

//connect(customPlot->xAxis, SIGNAL(rangeChanged(QCPRange)),customPlot->xAxis2, SLOT(setRange(QCPRange)));

//connect(customPlot->yAxis, SIGNAL(rangeChanged(QCPRange)),customPlot->yAxis2, SLOT(setRange(QCPRange)));

// setup a timer that repeatedly calls MainWindow::realtimeDataSlot:

connect(&dataTimer, SIGNAL(timeout()), this,SLOT(realtimeDataSlot()));

dataTimer.start(0); // Interval 0 means to refresh as fast as possible

customPlot->legend->setVisible(true);

}

void MainWindow::realtimeDataSlot()

{

//key的单位是秒

double key = QDateTime::currentDateTime().toMSecsSinceEpoch()/1000.0;

qsrand(QTime::currentTime().msec() + QTime::currentTime().second() *10000);

//使用随机数产生两条曲线

double value0 = qrand() % 100;

double value1 = qrand() % 80;

if (ui->checkBox_temp->isChecked())

ui->customPlot->graph(0)->addData(key, value0);//添加数据1到曲线1

if (ui->checkBox_hui->isChecked())

ui->customPlot->graph(1)->addData(key, value1);//添加数据2到曲线2

//删除8秒之前的数据。这里的8要和下面设置横坐标宽度的8配合起来

//才能起到想要的效果，可以调整这两个值，观察显示的效果。

ui->customPlot->graph(0)->removeDataBefore(key-8);

ui->customPlot->graph(1)->removeDataBefore(key-8);

//自动设定graph(1)曲线y轴的范围，如果不设定，有可能看不到图像

//也可以用ui->customPlot->yAxis->setRange(up,low)手动设定y轴范围

ui->customPlot->graph(0)->rescaleValueAxis();

ui->customPlot->graph(1)->rescaleValueAxis(true);

//这里的8，是指横坐标时间宽度为8秒，如果想要横坐标显示更多的时间

//就把8调整为比较大到值，比如要显示60秒，那就改成60。

//这时removeDataBefore(key-8)中的8也要改成60，否则曲线显示不完整。

ui->customPlot->xAxis->setRange(key+0.25, 8, Qt::AlignRight);//设定x轴的范围

ui->customPlot->replot();

}

-示例效果

参考资料：

https://blog.csdn.net/guojunjunjun2006/article/details/122376139?spm=1001.2101.3001.6650.3&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-3.pc_relevant_antiscanv2&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-3.pc_relevant_antiscanv2&utm_relevant_index=6

http://blog.chinaunix.net/uid-11829250-id-5750296.htmlhttps://blog.csdn.net/baojiboy/article/details/119899271

https://blog.csdn.net/baidu_31788709/article/details/120471313

2D热力图

https://blog.csdn.net/qq10097355/article/details/105741397

公众号二维码

End：如果有兴趣了解量化交易、数据分析和互联网+的实用技术，欢迎关注本公众号