qt實現簡單的動態取點線

      相信小夥伴們在做數據採集後，想要動態的獲取點，實時的顯示在圖上，好看好數據，下面這個例子可以實現這個功能，大家可以對其進行相對應的更改，達到你實現的想法：

     實現效果：

 

如果大家不想用直線，想用平滑曲線，把QLineSeries 類改成 QSplineSeries 就可以啦。

話不多說，上代碼：

首先在工程項目中（.pro文件）裏添加：

QT       += charts

對應頭文件： 

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QtCharts>

QT_CHARTS_USE_NAMESPACE

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

    void createXY();
private slots:
    void on_btn_open_clicked();

    void on_btn_stop_clicked();
protected:
    void timerEvent(QTimerEvent *event) Q_DECL_OVERRIDE;
private:
    QLineSeries * lineSeries;  //記錄當前的序列
    QValueAxis *  curAxisX;    //記錄當前的座標X
    QValueAxis *  curAxisY;    //記錄當前的座標Y
    bool open;  //開關
    qreal t = 0;
    int max_X =100;
    int Timer ;

private:
    Ui::MainWindow *ui;
};

#endif // MAINWINDOW_H

對應的cpp文件：

#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QTime>
#include <QThread>
MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    createXY(); //初始化座標軸
    open = true;
}

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

void MainWindow::createXY()
{
    //添加標題頭
    QChart *chart = new QChart();
    chart->setTitle(tr("這是我的曲線"));
    ui->viewxy->setChart(chart);
    ui->viewxy->setRenderHint(QPainter::Antialiasing);

    //設置
    lineSeries = new QLineSeries();
    lineSeries->setName(tr("獲取的數據"));

    QPen pen;
    pen.setStyle(Qt::SolidLine);
    pen.setColor(Qt::red);
    pen.setWidth(2);

    lineSeries->setPen(pen);
    chart->addSeries(lineSeries);

    curAxisX = new QValueAxis();
    curAxisY = new QValueAxis();

    curAxisX->setRange(0,max_X);//設置座標軸範圍
    curAxisX->setLabelFormat("%.2f"); //標籤格式
    curAxisX->setTitleText(tr("time(sec)"));

    curAxisY->setRange(0,100);
    curAxisY->setLabelFormat("%d"); //標籤格式
    curAxisY->setTitleText(tr("Value"));

    chart->addAxis(curAxisX,Qt::AlignBottom);
    chart->addAxis(curAxisY,Qt::AlignLeft);

    lineSeries->attachAxis(curAxisX);
    lineSeries->attachAxis(curAxisY);

    lineSeries->setUseOpenGL(true);
}

void MainWindow::on_btn_open_clicked()
{

    Timer = startTimer(10);

}

void MainWindow::on_btn_stop_clicked()
{
    open = false;
    lineSeries->clear();
    t = 0;
    killTimer(Timer);
}

void MainWindow::timerEvent(QTimerEvent *event)
{
    if(event->timerId() == Timer)
    {
        if(t >= max_X)
        {
            max_X +=1; //擴大
            curAxisX->setMax(max_X);
        }
        qreal rd;
        qreal y = 0;
        qsrand(QTime::currentTime().second());
        rd =(qrand() % 100);
        y = rd +5;
        lineSeries->append(t,y);
        t++;
    }
}

 

    這裏的利用Qtime 獲取觸發事件，這裏只是簡單的使用，小夥伴們在實際運用中，可以使用線程來實現這個功能，相關多線程，串口通訊可以關注我的博客，在我博客都有相關部分。

    一起學習與進步吧。

    程序例子：

    鏈接：https://pan.baidu.com/s/1FBZEjGfX4nGu-2arqzAtAw 
    提取碼：80tr