QCustomplot使用分享(二) 源码解读

一、头文件概述

     从这篇文章开始，我们将正式的进入到QCustomPlot的实践学习中来，首先我们先来学习下QCustomPlot的类图，如果下载了QCustomPlot源码的同学可以自己去QCustomPlot的目录下documentation/qcustomplot下寻找一个名字叫做index.html的文件，将其在浏览器中打开，也是可以找到这个库的类图。如图1所示，是组成一个QCustomPlot类图的可能组成形式。

1. 一个图表(QCustomPlot)：包含一个或者多个图层、一个或多个item(用于展示一些固定的元素，例如文本、线段等)、一个或者多个可以绘制的元素、一个布局
2. 一个图层(QCPLayer)：包含基本的元素(QCPLayerable)
3. 一个QCPAbstractItem：包含一个或者多个位置信息
4. 一个坐标轴矩形(QCPAxisRect):包含多个坐标轴、有一个图例类(多个图例项)

图1 图表组成

      在一个QCustomPlot类图中最重要、用的最多的是QCPLayerable元素，几乎除了QCPLayer以外的元素都是继承于该类。

1. QCPAbstractPlottable：绘图元素，包含：折线图(QCPGraph)、曲线图(QCPCurve)、柱状图(QCPBars)、QCPStatiBox(盒子图)、QCPColorMap(色谱图)、QCPFinancial(金融图)
2. QCPAbstractItem：标示项，包含：直线(QCPItemStraightLine)、线段(QCPItemLine)、曲线(QCPItemCurve)、矩形(QCPItemRect)、椭圆(QCPItemEllipse)、文本(QCPItemText)、小圆球(QCPItemTracer)、图片(QCPItemPixmap)、括弧(QCPItemBracket)
3. 布局项(QCPLayoutElement)：布局项(QCPAbstractLegendItem)、坐标轴矩形(QCPAxisRect)
4. 网格线(QCPGrid)：每一个坐标轴对应一个网格线
5. 坐标轴(QCPAxis)：一个坐标轴矩形包含四个坐标轴，上下左右四个坐标轴。

图2 可以绘制元素类图

二、一个简单的示例

    如下代码是一个简单的蜡烛图代码，源码我是从官方网站上扒下来的，只是为了让大家有一个初步的了解，本来是英文的注释我换成了中文，然后添加了我自己个人的一些理解，运行结果如图3所示

 1 customPlot->legend->setVisible(true);
 2  
 3 // 生成2种随机的蜡烛图数据，第一个是蜡烛图数据，第二个是美国线数据
 4 int n = 500;
 5 QVector<double> time(n), value1(n), value2(n);
 6 QDateTime start = QDateTime(QDate(2014, 6, 11));
 7 start.setTimeSpec(Qt::UTC);
 8 double startTime = start.toTime_t();
 9 double binSize = 3600*24; // 1天的数据
10 time[0] = startTime;
11 value1[0] = 60;