利用QT实现X轴为时间动态显示曲线

/*********************************************************************************
  *Author:  zyh
  *Version: 1.0 //版本
  *Date: 2020-01-08 //完成日期
  *Description: 主要实现设置第二张图纸//用于主要说明此程序文件完成的主要功能
                无输入值以及返回值 //与其他模块或函数的接口、输出值、取值范围、
                无/含义及参数间的控制、顺序、独立及依赖关系
**********************************************************************************/
void MainWindow::SetTwoGraph()  //设置第二张图纸
{
    fp3 = ui->widget_lofar; //创建一个画图指针

    fp3->setInteractions(QCP::iRangeDrag|QCP::iRangeZoom| QCP::iSelectPlottables);//可拖拽+可滚轮缩放

    QSharedPointer dateTicker(new QCPAxisTickerDateTime);//日期做X轴
    dateTicker->setDateTimeFormat("hh:mm:ss");//日期格式(可参考QDateTime::fromString()函数)
    fp3->xAxis->setTicker(dateTicker);//设置X轴为时间轴


    fp3->xAxis->setLabel("频率/Hz(单位:*10^4)");//x轴显示文字
    fp3->yAxis->setLabel("幅度/dB");//y轴显示文字
    //fp3->xAxis->setRange(0,5);//当前X轴显示范围
    fp3->yAxis->setRange(0,2.5);//当前y轴显示范围

    //每条曲线都会独占一个graph()
    fp3->addGraph();
    fp3->graph(0)->setPen(QPen(Qt::blue));//曲线颜色

    fp3->graph(0)->setBrush(QBrush(QColor(0,255,255,20)));//曲线与X轴包围区的颜色
    //自动调整XY轴的范围，以便显示出graph(0)中所有的点
    //给第一个graph设置rescaleAxes()，后续所有graph都设置rescaleAxes(true)即可实现显示所有曲线
   /* fp3->graph(0)->rescaleAxes();*/

    //通过传递的轴的QCustomPlot进行注册,简洁理解QCPColorMap的数据为（x轴，y轴;颜色，值value）
    m_pColorMap = new QCPColorMap(fp3->xAxis,fp3->yAxis);
    m_pColorMap->data()->setSize(101,4096);//设置整个图（x,y）点数,X轴50个点，y轴4096个点
    m_pColorMap->data()->setRange(QCPRange(0,2.5),QCPRange(2,0));//setRange是设置X轴以及Y轴的范围

//  for(int x=0;x<=100;x++)
//  {
//    for(int y=0;y<4096;y++)
//    {
//        m_pColorMap->data()->setCell(x,y,qCos(x/10.0)+qSin(y/10.0));
//    }
//  }
    m_pColorMap->setGradient(QCPColorGradient::gpCold);//设置默认渐进色变化（可在QCPColorGradient中查看）
    m_pColorMap->rescaleDataRange(true);

    dataTimer =new QTimer;
    connect(dataTimer, SIGNAL(timeout()), this, SLOT(realtimeDataSlot()));
    dataTimer->start(0); // Interval 0 means to refresh as fast as possible
// 立即刷新图像
    fp3->rescaleAxes();//自适应大小
    ui->widget_lofar->replot();
}




void MainWindow::realtimeDataSlot()
{
    //key的单位是秒
    double key = QDateTime::currentDateTime().toMSecsSinceEpoch()/1000.0;
    //static QTime time(QTime::currentTime());
    // calculate two new data points:
   // double key = time.elapsed()/1000.0;
    qsrand(QTime::currentTime().msec() + QTime::currentTime().second() * 10000);
    //使用随机数产生两条曲线
    double value0 = qrand() % 100;
    double value1 = qrand() % 80;
    //if (ui->checkBox_temp->isChecked())
        fp3->graph(0)->addData(key, value0);//添加数据1到曲线1
    //if (ui->checkBox_hui->isChecked())
       //fp3->graph(1)->addData(key, value1);//添加数据2到曲线2
    //删除8秒之前的数据。这里的8要和下面设置横坐标宽度的8配合起来
    //才能起到想要的效果，可以调整这两个值，观察显示的效果。
    //fp3->graph(0)->removeDataBefore(key-8);
    //fp3->graph(1)->removeDataBefore(key-8);

  //自动设定graph(1)曲线y轴的范围，如果不设定，有可能看不到图像
//也可以用ui->customPlot->yAxis->setRange(up,low)手动设定y轴范围


    fp3->graph(0)->rescaleValueAxis();
   // ui->customPlot->graph(1)->rescaleValueAxis(true);

    //这里的8，是指横坐标时间宽度为8秒，如果想要横坐标显示更多的时间
    //就把8调整为比较大到值，比如要显示60秒，那就改成60。
    //这时removeDataBefore(key-8)中的8也要改成60，否则曲线显示不完整。
    fp3->xAxis->setRange(key+0.25, 8, Qt::AlignRight);//设定x轴的范围
    fp3->replot();
}

最终实现效果如上图