Qt圖形圖像開發(fā)之曲線圖模塊QCustomplot庫(kù)生成靜態(tài)、動(dòng)態(tài)曲線詳細(xì)教程圖解

更新時(shí)間：2020年03月10日 16:29:37 作者：52_赫茲的鯨

這篇文章主要介紹了Qt圖形圖像開發(fā)之曲線圖模塊QCustomplot庫(kù)畫靜態(tài)、動(dòng)態(tài)曲線詳細(xì)教程圖解,需要的朋友可以參考下

Qt曲線圖模塊QCustomPlot庫(kù)介紹

QCustomPlot是一個(gè)小型的Qt畫圖標(biāo)類，支持繪制靜態(tài)曲線、動(dòng)態(tài)曲線、多重坐標(biāo)曲線，柱狀圖，蠟燭圖等。只需要在項(xiàng)目中加入頭文件qcustomplot.h和qcustomplot.cpp文件，然后使一個(gè)widget提升為QCustomPlot類，即可使用。

QCustomPlot官網(wǎng)：

http://www.qcustomplot.com/

QCustomPlot下載地址：

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

QCustomPlot幫助文件

QCustomPlot源碼包中，有QCustomPlot幫助文件，將其添加進(jìn)Qt幫助文件，如圖，點(diǎn)擊添加按鈕，在下載的QCustomPlot源碼包中找到qch為后綴的文件進(jìn)行添加。

Qt曲線圖模塊QCustomPlot庫(kù)簡(jiǎn)單例子詳解

1.建立Qt工程，將下載的QCustomPlot源碼中的qcustomplot.h和qcustomplot.cpp文件復(fù)制到項(xiàng)目所在文件夾，如圖

2.QtCreater中，右鍵項(xiàng)目，添加現(xiàn)有文件，如圖，選擇qcustomplot.h和qcustomplot.cpp添加：

3.在UI界面拖入一個(gè)widget，如圖

4.UI界面右鍵widget，點(diǎn)擊提升為，選擇全局包含，如圖

這里強(qiáng)調(diào)一下：Qt提升控件時(shí)，通常提升的類名稱中，每個(gè)單詞的首字母必須大寫【與Qt控件命名規(guī)則保持一致，各種第三方控件都采用這種命名格式】，否則無法識(shí)別，如這里必須寫成QCustomPlot而不能寫成Qcustomplot或qcustomplot

另一種簡(jiǎn)單方法是將被提升類的名稱直接復(fù)制過來粘貼。

5.選擇項(xiàng)目的.pro文件，添加printsupport，如圖，QCustomPlot包含了一些打印的東西，如果沒有這一步，程序會(huì)報(bào)錯(cuò)

6.最后一步，編寫代碼：

頭文件：

#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 = 0);
  ~Widget();

private:
  Ui::Widget *ui;
};

#endif // WIDGET_H

cpp文件：

#include "widget.h"
#include "ui_widget.h"
#include <QVector>
Widget::Widget(QWidget *parent) :
  QWidget(parent),
  ui(new Ui::Widget)
{
  ui->setupUi(this); 
    //設(shè)定背景為黑色
    //ui->widget->setBackground(QBrush(Qt::black));
    //設(shè)定右上角圖形標(biāo)注可見
    ui->widget->legend->setVisible(true);
    //設(shè)定右上角圖形標(biāo)注的字體
    ui->widget->legend->setFont(QFont("Helvetica", 9));
    QVector<double> x(101),y(101);
      //圖形為y=x^3
      for(int i=0;i<101;i++)
      {
        x[i] = i/5.0-10;
        y[i] = x[i]*x[i]*x[i];//qPow(x[i],3)
      }
      //添加圖形
      ui->widget->addGraph();
      //設(shè)置畫筆
      ui->widget->graph(0)->setPen(QPen(Qt::blue));
      //設(shè)置畫刷,曲線和X軸圍成面積的顏色
       ui->widget->graph(0)->setBrush(QBrush(QColor(255,255,0)));
      //設(shè)置右上角圖形標(biāo)注名稱
      ui->widget->graph(0)->setName("曲線");
      //傳入數(shù)據(jù)，setData的兩個(gè)參數(shù)類型為double
      ui->widget->graph(0)->setData(x,y);

      QVector<double> temp(20);
      QVector<double> temp1(20);
      //圖形為y = 100*x;
      for(int i=0;i<20;i++)
      {
        temp[i] = i;
        temp1[i] = 10*i+10;
      }
      //添加圖形
      ui->widget->addGraph();
      //設(shè)置畫筆
      ui->widget->graph(1)->setPen(QPen(Qt::red));
      //設(shè)置畫刷,曲線和X軸圍成面積的顏色
      //ui->widget->graph(1)->setBrush(QBrush(QColor(0,255,0))); 
      //傳入數(shù)據(jù)
      ui->widget->graph(1)->setData(temp,temp1); 

      /*-------------------------------------------*/
      //畫動(dòng)態(tài)曲線時(shí)，傳入數(shù)據(jù)采用addData，通過定時(shí)器多次調(diào)用，并在之后調(diào)用ui->widget->replot(); 
      //動(dòng)態(tài)曲線可以通過另一種設(shè)置坐標(biāo)的方法解決坐標(biāo)問題： 
      //setRange ( double position, double size, Qt::AlignmentFlag alignment ) 
      //參數(shù)分別為：原點(diǎn)，偏移量，對(duì)其方式，有興趣的讀者可自行嘗試，歡迎垂詢 
      /*-------------------------------------------*/ 

      //設(shè)置右上角圖形標(biāo)注名稱
      ui->widget->graph(1)->setName("直線");
      //設(shè)置X軸文字標(biāo)注
      ui->widget->xAxis->setLabel("time");
      //設(shè)置Y軸文字標(biāo)注
      ui->widget->yAxis->setLabel("temp/shidu");
      //設(shè)置X軸坐標(biāo)范圍
      ui->widget->xAxis->setRange(-20,20);
      //設(shè)置Y軸坐標(biāo)范圍
      ui->widget->yAxis->setRange(-1100,1100);
      //在坐標(biāo)軸右側(cè)和上方畫線，和X/Y軸一起形成一個(gè)矩形
      ui->widget->axisRect()->setupFullAxesBox(); 
}

Widget::~Widget()
{
  delete ui;
}

效果圖如下：