QtCharts的简单用法（1）--Qt

前言

继QWT、QCustomPlot绘制折线图之后，在Qt5.7版本后将Qt Charts加入到了Qt模块中。我们可以方便的使用这个模块，不用学复杂的QWT了。Qt Charts可以绘制很多样式的图形，比如折线、饼图等，可以根据Qt自带的示例来看，可以帮助更快的做出效果。

 

简述

用Qt Charts绘制，大概分为四个部分：数据（QXYSeries）、QChart(不知怎么称呼)、坐标轴（QAbstractAXis）和视图（QChartView）。

要注意的是 QChart要先添加数据（QXYSeries），再加载坐标轴(加载轴的过程是先添加轴到Chart上，再附加轴到Series上)。这个一定要注意，我之前就是不清楚这部分，然后一直出问题。

还有一点就是： QChartView是继承的是QGraphicsView，QChart继承的是QGraphicsWidget，所以我们可以用图形视图框架的知识，在其上面进行拓展，Qt自带的项目Callout，我觉得就是很好的示例。

 

例子

下面说一下详细的流程：

（1）在.pro文件中加入 

QT    +=charts

(2)在声明文件中，要写命名空间，这个比较容易忘记。这个也有很多写法，这里不赘述。

QT_CHARTS_USE_NAMESPACE

（3）现在就要将各个部分搭建好，这就是之前说的要注意的地方。如果用的是designer，可以用控件 Graphics View代替，再将其提升为QChartView就可以了（提升的类名称是QtCharts::QChartView,头文件为qchartview.h），我这里就是用的这种方式。

    m_series=new QLineSeries;

    m_chart=new QChart;

    m_series=new QLineSeries;
    m_series->append(0,0);
    m_series->setName("ss");
    m_chart->addSeries(m_series);
    m_chart->createDefaultAxes();


    m_axisX=new QValueAxis;
    m_axisX->setRange(0,60);
    m_axisX->setGridLineVisible(true);
    m_axisX->setTickCount(11);     //标记的个数
    m_axisX->setMinorTickCount(5); //次标记的个数

    m_axisY=new QValueAxis;
    m_axisY->setRange(-5,10);
    m_axisY->setGridLineVisible(true);
    m_axisY->setTickCount(6); 
    m_axisY->setMinorTickCount(2);

    m_chart->setAxisX(m_axisX,m_series);
    m_chart->setAxisY(m_axisY,m_series);

    m_chart->legend()->hide();

    ui->graphicsView->setChart(m_chart);
    ui->graphicsView->setRenderHint(QPainter::Antialiasing);

（4）添加数据。这里做的是动态的，通过定时器控制。里面用了一些小技巧，仔细看

void MainWindow::handleTimeout()
{
    if(ui->graphicsView->isVisible())
    {//在可视的情况下刷新数据
        int y=qrand()%15-5;
        qDebug()< points=m_series->pointsVector();
        points.append(QPointF(m_x,y));

        if(points.size()>m_max){//达到限值
            points.pop_front();
        }
        m_series->replace(points);

        if(m_x>60)
        {
            m_chart->axisX()->setRange(m_x-59,m_x);
        }

        m_x++;
    }

}

(5)结果图，这里我还将示例Callout的部分代码加了进去，可以查看当前点的值。

源码

本来源码随着硬盘崩了，而丢了。但是这篇博客被评论要源码的有点多，我又重新写了一份：

https://download.csdn.net/download/xiaopei_yan/12329562

结束语

好了，小课堂结束了。