QT学习之动态实时绘图_qt上位机绘制实时-优快云博客

最近需要利用Qt来做一个上位机，今天在B站上学习了动态实时绘图，现在写这篇文章记录一下。

绘图需要一个图表，图表里面包含的元素里面有坐标轴，标题，变量。

图表的初始化

首先定义图表的相关元素，坐标轴、标题、相关变量等等。可以将他编写成为一个初始化函数，在ui界面初始化的时候一同初始化。定义为chart_init()。

void MainWindow::chart_init()
{
    //第一步设置标题
    chart_1->setTitle("实时绘图");
    ui->chartview->setChart(chart_1);
    //设置和坐标轴
    axis_x->setTitleText("值");
    axis_x->setRange(0,100);
    chart_1->addAxis(axis_x,Qt::AlignBottom);
    //设置y轴
    axis_y->setTitleText("值");
    axis_y->setRange(-1.5,1.5);
    chart_1->addAxis(axis_y,Qt::AlignLeft);
    //增加数据，line用于存储曲线的点数据
    line->setName("实时绘图");
    chart_1->addSeries(line);//line被添加到图表中,这样才可以显示
    line->attachAxis(axis_x);//绑定x轴
    line->attachAxis(axis_y);//绑定y轴
}

其中chart_1对象的类型为QChart类，它与图表中的坐标轴、标题有关可以用于初始化图表的相关元素。line对象的类型为QLineSeries,用来表示折现图数据，他需要被添加到坐标轴并且绑定x,y轴才可以进行显示。上面的需要用到的对象，都在主窗口的构造函数中进行初始化，如下列代码所示:

下列代码放入MainWindow::MainWindow这个构造函数里：
    line=new QLineSeries;
    chart_1=new QChart;
    axis_x=new QValueAxis;
    axis_y=new QValueAxis;

创建的对象，主要放到mainwindow.h文件的MainWindow的类的private中，上面的代码在其.c文件是在进行声明。

    QChart *chart_1;//创建对象
    QLineSeries *line ;
    QValueAxis *axis_x;
    QValueAxis *axis_y;

除了代码的声明，还需要去ui界面选择图表的控件。选择Graphics View,拖到ui界面上，将类提升成Mychartview,这个类应该是可以自己取的，提升之后，需要新建一个类Mychartview加入到工程当中。

定时器槽函数编写

实时动态画图由于需要根据时间，所以需要创建时间的对象，由系统的定时器QTimer类型，像上面chart,line那样进行定义，在主窗口的构造函数当中添加以下代码

    timer->setInterval(100);//括号里面是ms，设置触发间隔
    timer->start();
    connect(timer,SIGNAL(timeout()),this,SLOT(onTimeout()));//通过timer发送信号，到定时器溢出时，发送至主窗口，使用时间的槽函数

编写的槽函数如下代码所示:

void MainWindow::onTimeout()
{
    //用户操作代码
    static int count=0;
    //让坐标轴动态移动
    if(count>100){
        line->remove(0);//删除旧点
        chart_1->axisX()->setMin(count-100);//获取x轴的点之后，并使最开始的坐标轴减去100.
        chart_1->axisX()->setMax(count);
    }
    line->append(QPointF(count,rand()%10));//向曲线对象中添加新的点，横坐标为count,另一个为纵坐标
    count++;
}

最终的动态图就可以绘制成功了，如下图所示: