QT绘图控件QCustomPlot快速入门(一)
QCustomPlot下载安装
QCustomPlot是一个开源的绘图控件,下载地址为:https://www.qcustomplot.com/index.php/download;该绘图控件的调用比较简单,将其源代码的头文件和源文件添加到项目工程即可。
借助QCustomPlot库可以实现柱状图、折线图等,在其基础上,可以轻松实现曲线的平移、放大、取值、标记等功能,利用其预留的接口可以派生类,随意定制曲线的样式,可以支持频谱图、瀑布图、星座图等的绘制。QCustomPlot库在执行上,相比QChart在绘图方面效率更高、且移植比较方便。
当前最新版本为2.1.1:
简单调用示例
使用QT新建一个工程,包含.UI文件,选择项目类型为Widget即可,如下所示。
在工程中右键添加QCustomPlot库源文件,并在widget.cpp中包含其头文件:
双击打开UI文件,添加一个Widget控件,以及几个按钮pushbutton控件;
在所添加的Widget区域点击右键,选择“提升为”按钮,提升类名称输入“QCustomPlot”,点击添加。
QCustomPlot是一个绘图的类,它继承于Widget,界面中的Widget类提升为QCustomPlot才能够绘图。
该示例实现的功能如下:点击按钮生成一条曲线,然后点击叠加按钮可以在上一曲线基础上再叠加显示一条曲线,可以清除叠加曲线,也可以将全部曲线清除。具体实现参考代码:
头文件实现:
#ifndef WIDGET_H
#define WIDGET_H
#include <QWidget>
#include "qcustomplot.h"
namespace Ui {
class Widget;
}
class Widget : public QWidget
{
Q_OBJECT
public:
explicit Widget(QWidget *parent = nullptr);
~Widget();
void InitCustomPlot();
private slots:
void on_Button_Clear_clicked();
void on_Button_Paint_clicked();
void on_Button_Paint_Add_clicked();
void on_Button_Clear_Single_clicked();
private:
Ui::Widget *ui;
QVector<double> arrX;
QVector<double> arrY;
QVector<double> arrX2;
QVector<double> arrY2;
QCPGraph* AddGraph;
QCPGraph* BasicGraph;
QCustomPlot *MQCustomPlot;
};
#endif // WIDGET_H
源文件实现:
#include "widget.h"
#include "ui_widget.h"
#include "qcustomplot.h"
Widget::Widget(QWidget *parent) :
QWidget(parent),
ui(new Ui::Widget)
{
ui->setupUi(this);
//初始化画图widget
InitCustomPlot();
}
Widget::~Widget()
{
delete MQCustomPlot;
delete ui;
}
void Widget::InitCustomPlot()
{
MQCustomPlot = new QCustomPlot();
MQCustomPlot = ui->MyCustomPlot;
for(int i =0;i<=60;i++)
{
arrX.append(i);
arrY.append(i);
}
for(int i =0;i<=60;i++)
{
arrX2.append(i);
arrY2.append(i*2);
}
//设置坐标轴标签名称
MQCustomPlot->xAxis->setLabel("x");
MQCustomPlot->yAxis->setLabel("y");
//设置坐标轴显示范围,否则我们只能看到默认的范围
MQCustomPlot->xAxis->setRange(0,70);//横坐标范围
MQCustomPlot->yAxis->setRange(0,125);//纵坐标范围
//两条曲线初始化为空
AddGraph=nullptr;
BasicGraph=nullptr;
//设置图例
MQCustomPlot->legend->setVisible(true); //设置图例可见
MQCustomPlot->legend->setBrush(QColor(255,255,255,0));//设置背景透明
MQCustomPlot->axisRect()->insetLayout()->setInsetAlignment(0,Qt::AlignTop|Qt::AlignLeft); //设置图例居左上
}
void Widget::on_Button_Clear_clicked()
{
MQCustomPlot->clearGraphs();//清除所有曲线,此种方式会将曲线对象销毁
AddGraph=nullptr;
BasicGraph=nullptr;
//曲线重绘
MQCustomPlot->replot();
}
void Widget::on_Button_Paint_clicked()
{
//添加一条曲线
//向绘图区域QCustomPlot(从widget提升来的)添加一条曲线
if(BasicGraph==nullptr)
BasicGraph = MQCustomPlot->addGraph();
else
return;
//设置画笔
BasicGraph->setPen(QPen(Qt::blue));
//设置画刷,曲线和X轴围成面积的颜色
BasicGraph->setBrush(QBrush(QColor(255,255,255,0)));//透明
//设置右上角图形标注名称
BasicGraph->setName("基础曲线");
//传入数据,setData的两个参数类型为double
BasicGraph->setData(arrX,arrY);
//曲线重绘
MQCustomPlot->replot();
}
//绘制叠加波形
void Widget::on_Button_Paint_Add_clicked()
{
//继续添加一条曲线
if(AddGraph==nullptr)
AddGraph = MQCustomPlot->addGraph();
else
return;
//设置画笔
AddGraph->setPen(QPen(Qt::red));
//设置画刷,曲线和X轴围成面积的颜色
AddGraph->setBrush(QBrush(QColor(255,255,255,0)));//透明
AddGraph->setName("叠加曲线");
//传入数据,setData的两个参数类型为double
AddGraph->setData(arrX2,arrY2);
//曲线重绘
MQCustomPlot->replot();
}
void Widget::on_Button_Clear_Single_clicked()
{
MQCustomPlot->removeGraph(AddGraph);//清除单个曲线,同样会销毁曲线对象
AddGraph=nullptr;//重新赋值为空指针
//曲线重绘
MQCustomPlot->replot();
}
最终效果展示: