19、QChartView绘图

1、需要在工程文件.pro文件中添加，QT += charts

2、在ui界面放置一个widget控件，并将其提升为QChartView，继承于QWidget

　如果将一个widget提升了QChartView后报错，在ui_mainwindow.h中加入

QT_CHARTS_USE_NAMESPACE

3、构造一个QChart对象；

QChart* mychart; // 构建图表类
QLineSeries *line; // 构建一个折线系列

mychart = new QChart;
    line = new QLineSeries(this); // 构建折线对象
    // 在折线上添加数据
    for(size_t i=0;i<100;i++)
    {
        line->append(i,4*sin(0.6f*i));  // 在折线上添加点
    }
    // 将折线添加到图标上
    mychart->addSeries(line);
    mychart->createDefaultAxes();  // 创建默认的坐标轴
    mychart->setTheme(QChart::ChartThemeBlueCerulean);  // 设置背景为绿色
    mychart->legend()->hide(); // 隐藏图例

    ui->widget->setChart(mychart); // 图表绑定在视图上

4、图表添加修饰

 // 将折线添加到图标上
    mychart->addSeries(line);
    mychart->createDefaultAxes();  // 创建默认的坐标轴
    mychart->setTheme(QChart::ChartThemeBlueCerulean);  // 设置背景为绿色
    mychart->legend()->hide(); // 隐藏图例
    // 还是出现中文乱码？
    mychart->setTitle(QString::fromLocal8Bit("图表标题")); // 设置图表标题

    ui->widget->setChart(mychart); // 图表绑定在视图上
    // 设置反走样 折线平滑处理
    ui->widget->setRenderHint(QPainter::Antialiasing,true);

// 注意在析构的时候，释放曲线
 mychart->removeAllSeries();  // 自带的析构函数没有释放这块，自己做析构

5、使用QGraphicView绘制图表

 QGraphicsScene* Space;  // 构建一个场景

在上面的基础上进行修改

mychart = new QChart;
    line = new QLineSeries(this); // 构建折线对象
    // 在折线上添加数据
    for(size_t i=0;i<100;i++)
    {
        line->append(i,4*sin(0.6f*i));  // 在折线上添加点
    }
    // 将折线添加到图标上
    mychart->addSeries(line);
    mychart->createDefaultAxes();  // 创建默认的坐标轴
    mychart->setTheme(QChart::ChartThemeBlueCerulean);  // 设置背景为绿色
    mychart->legend()->hide(); // 隐藏图例
    // 还是出现中文乱码？
    mychart->setTitle(QString::fromLocal8Bit("图表标题")); // 设置图表标题
    mychart->setGeometry(0, 0, 300, 200); // 设置图表尺寸
    //QGraphicsItem--->mychart
    Space = new QGraphicsScene(this);  // 构建场景
    Space->addItem(mychart);      // 图表添加到视图上
    ui->graphicsView->setScene(Space);   // 给场景设置视图
    //ui->widget->setChart(mychart); // 图表绑定在视图上
    // 设置反走样 折线平滑处理
    //ui->widget->setRenderHint(QPainter::Antialiasing,true);
    ui->graphicsView->setRenderHint(QPainter::Antialiasing,true);

6、绘制动态折线图

// 构建一个定时器，移动曲线，更新曲线，定时器超时槽函数

    QChart* mychart; // 构建图表类
    //QLineSeries *line; // 构建一个折线系列
    QSplineSeries *line;  // 构建一个曲线系列
    QGraphicsScene* Space;  // 构建一个场景
    QTimer *timer; // 创建一定定时器
    QValueAxis* AxisX;  // 图表X坐标轴
    QValueAxis* AxisY;  // 图表Y坐标轴
    qint64 tmLast; // 上次进入定时器的时间
private:
    Ui::Widget *ui;
private slots:
    void Slot_Timeout();   // 定时器超时函数

在前面的基础上修改代码，构造函数

const quint32 Max_Axis = 300; // 定义X轴坐标范围

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget), tmLast(0) // 构造函数中变量初始化
{
    ui->setupUi(this);

    mychart = new QChart;
    //line = new QLineSeries(this); // 构建折线对象
    line = new QSplineSeries(this);
    // 在折线上添加数据
    for(size_t i=0;i<Max_Axis;i++)
    {
        line->append(i,4*sin(0.6f*i));  // 在折线上添加点
    }
    // 将折线添加到图标上
    mychart->addSeries(line);
    //mychart->createDefaultAxes();  // 创建默认的坐标轴

    // 构建自己的坐标轴
    AxisX = new QValueAxis(this);
    AxisX->setRange(0, Max_Axis);
    AxisX->setTitleText(QString::fromLocal8Bit("X"));

    AxisY = new QValueAxis(this);
    AxisY->setRange(-4, 4); // 设置坐标轴范围
    AxisY->setTitleText(QString::fromLocal8Bit("Y")); // 设置Y轴坐标
    // 图表添加坐标轴
    mychart->setAxisX(AxisX, line);
    mychart->setAxisY(AxisY, line);

    mychart->setTheme(QChart::ChartThemeBlueCerulean);  // 设置背景为绿色
    mychart->legend()->hide(); // 隐藏图例
    // 还是出现中文乱码？
    mychart->setTitle(QString::fromLocal8Bit("图表标题")); // 设置图表标题
    mychart->setGeometry(0, 0, 1000, 800); // 设置图表尺寸

    //QGraphicsItem--->mychart
    Space = new QGraphicsScene(this);  // 构建场景
    Space->addItem(mychart);      // 图表添加到视图上
    ui->graphicsView->setScene(Space);   // 给场景设置视图
    //ui->widget->setChart(mychart); // 图表绑定在视图上
    // 设置反走样 折线平滑处理
    //ui->widget->setRenderHint(QPainter::Antialiasing,true);
    ui->graphicsView->setRenderHint(QPainter::Antialiasing,true);

    // QTimer
    timer = new QTimer(this);
    timer->setInterval(100);  // 设置定时器间隔
    timer->start();           //启动定时器
    // 定时器与槽函数关联
    connect(timer,&QTimer::timeout,this,&Widget::Slot_Timeout);

实现曲线，动态显示，定时器超时函数

    // 静态数据存储第一次进入定时器的时间
    static QTime tmBegin = QTime::currentTime();  // 当前时间 17:33:12.34
    //qDebug() << "tmBegin:"<<tmBegin;  //
    // tmEllaspsed: tmBegin从第一次定义到现在的时间 超时时间的n倍
    qint64 tmEllaspsed = tmBegin.elapsed();
    // qDebug() << "tmEllaspsed:"<<tmEllaspsed;
    // 计算两次进入定时器经历的时间差
    // 这样获取时间更精确
    qint64 nSkip = tmEllaspsed - tmLast;  // 约等于定时器超时时间
    //qDebug() << "nSkip:"<< nSkip;
    // 获取曲线上的点
    QVector<QPointF> ptsOld = line->pointsVector();
    QVector<QPointF> ptsNew;    // 新数据
    // 曲线上后面的数据向前移动
    qint64 i=0;
    for(i=0;i< ptsOld.count() - nSkip;i++)
    {
        ptsNew.append(QPointF(i, ptsOld[i+ nSkip].y()));
    }
    // 补充新数据
    for(i = ptsOld.count() - nSkip;i < ptsOld.count();i++)
    {
        ptsNew.append(QPointF(i,4*sin(0.6f*i)));
    }
    // 更新数据
    line->replace(ptsNew);
    // 更新上次进入定时器的时间
    tmLast = tmEllaspsed;   //取现在的时间

 7、设置坐标轴的分辨率

AxisX->setTickCount(5); // 横坐标被5等分刻度显示

8、上面刷新的曲线，但是坐标轴不动；类似心电图的曲线动，坐标轴也在刷新

ui->setupUi(this);

    mychart = new QChart;
    //line = new QLineSeries(this); // 构建折线对象
    line = new QSplineSeries(this);
    // 在折线上添加初始化数据，第一个点
    m_x = 0.f;   // 表示第一个点的横坐标
    m_x= 300;  // 第一个点的初始化横坐标在8的位置上
    // 曲线上添加第一个点，第一个点的位置决定曲线终点的位置
    line->append(m_x, 1);


    // 将折线添加到图标上
    mychart->addSeries(line);
    //mychart->createDefaultAxes();  // 创建默认的坐标轴

    // 构建自己的坐标轴
    AxisX = new QValueAxis(this);
    AxisX->setRange(0, Max_Axis);
    AxisX->setTitleText(QString::fromLocal8Bit("X"));
    AxisX->setLabelFormat("%g");    // 去掉多余的0
    AxisX->setTickCount(5); // 横坐标被分割5份 显示

    AxisY = new QValueAxis(this);
    AxisY->setRange(-4, 4); // 设置坐标轴范围
    AxisY->setTitleText(QString::fromLocal8Bit("Y")); // 设置Y轴坐标
    // 图表添加坐标轴
    mychart->setAxisX(AxisX, line);
    mychart->setAxisY(AxisY, line);

    mychart->setTheme(QChart::ChartThemeBlueCerulean);  // 设置背景为绿色
    mychart->legend()->hide(); // 隐藏图例
    // 还是出现中文乱码？
    mychart->setTitle(QString::fromLocal8Bit("图表标题")); // 设置图表标题
    mychart->setGeometry(0, 0, 800,   600); // 设置图表尺寸

    //QGraphicsItem--->mychart
    Space = new QGraphicsScene(this);  // 构建场景
    Space->addItem(mychart);      // 图表添加到视图上
    ui->graphicsView->setScene(Space);   // 给场景设置视图
    //ui->widget->setChart(mychart); // 图表绑定在视图上
    // 设置反走样 折线平滑处理
    //ui->widget->setRenderHint(QPainter::Antialiasing,true);
    ui->graphicsView->setRenderHint(QPainter::Antialiasing,true);

    // QTimer
    timer = new QTimer(this);
    timer->setInterval(200);  // 设置定时器间隔
    timer->start();           //启动定时器
    // 定时器与槽函数关联
    connect(timer,&QTimer::timeout,this,&Widget::Slot_Timeout);

qreal xOffset = 0.f;  // 定义一个数据偏移量
    qreal dIncrease = 0.5;  // 每个数据的x轴增加1
    for(int i=0;i<10;i++)
    {
        m_x += dIncrease;
        xOffset += dIncrease;
        line->append(m_x, qrand()%4);
    }
    if(line->count()*dIncrease > 500)
    {
        line->removePoints(0,line->count() - 500);
    }
    // 单位x轴上长度
    qreal xUnit = mychart->plotArea().width()/(AxisX->max()-AxisX->min());
    qreal xScrell = xUnit * xOffset; // 需要滚动的值
    mychart->scroll(xScrell, 0); // 取得是变化量