QT charts 动态刷新曲线图

小编:啊南 434阅读 2021.01.18

前沿
用vs+QT开发应用程序时,当需要显示图表时,使用QtCharts是不错的选择。QtCharts是Qt提供的图表模块,在Qt5.7以前只有商业版才有QtCharts,但是从5.7开始,社区版也包含了QtCharts。QtCharts可以很方便地绘制常见的折线图、柱状图、饼图等图表。

概念介绍
1、QChart

类管理图表中的线、图例和轴的图形表示

2、QChartView

视图组件。一般在窗口设计界面上使用QChartView时,先放置一个QGraphicsView组件,然后升级为QChartView。

QChartView通过 setChart将QChart 添加为显示的图表。

ui.charView->setChart(chart);

3、QLineSeries

序列是数据的表现形式。也就是我们需要展示的数据。一般通过 chart->addSeries,将数据添加到图表。

当然,数据有多种类型,比如QSplineSeries等。

4、QValueAxis

坐标轴。一般的图表都有横轴和纵轴两个坐标轴。

chart->addAxis(axisX, Qt::AlignBottom);设置坐标轴与QChart 的关系。

serial->attachAxis(axisX); 设置数据与坐标轴的关系。

创建工程
要注意勾选 Charts模块,这样创建的工程,才会自动添加 QtCharts需要的头文件和lib文件。


在窗口设计界面上使用QChartView时,先放置一个QGraphicsView组件,然后升级为QChartView。

示例代码
1、初始化Charts

Fidx = 0;
  FmaxX = 0;
  FmaxY = 0;
  FminX = 1000;
  FminY = 1000;
 
  //创建QChart 和 QLineSeries
  chart = new QChart;
  serial = new QLineSeries();
  serial->setPointsVisible(true);
  chart->removeAllSeries();
  serial->clear();
  
  //创建 坐标轴
  QValueAxis* axisX = new QValueAxis;
  QValueAxis* axisY = new QValueAxis;
  axisX->setTitleText(bcq::str2qstr("时间")); //标题
  axisY->setTitleText(bcq::str2qstr("y")); //标题
 
  //关联chart、axisX、serial
  chart->addAxis(axisX, Qt::AlignBottom);
  chart->addAxis(axisY, Qt::AlignLeft);
 
  chart->addSeries(serial);
  serial->attachAxis(axisX);
  serial->attachAxis(axisY);
 
  chart->setTitle(bcq::str2qstr("test"));
  chart->legend()->hide();// clear up bar
  chart->setAnimationOptions(QChart::SeriesAnimations);
 
  ui.charView->setChart(chart);
  ui.charView->setRenderHint(QPainter::Antialiasing);
 
  chart->axisX()->setMin(0);
  chart->axisX()->setMax(1);
 
  chart->axisY()->setMin(175);
  chart->axisY()->setMax(225);
2、通过信号槽,动态添加需要显示的数据

//最多显示100个
  int count = serial->points().size();
  if (count >100)
  {
    serial->remove(0);
  }
 
  //改变坐标轴的范围
  chart->axisX()->setMin(FmaxX-100);
  chart->axisX()->setMax(FmaxX);
  //chart->axisY()->setMin(FminY);
  //chart->axisY()->setMax(FmaxY);
 
  //添加数据到serial
  serial->append(QPointF(x, y));

关联标签: