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();
}

最终效果展示：