1. 程式人生 > 實用技巧 >Qt-繪製圖表

Qt-繪製圖表

1 簡介

使用Qt的charts模組來繪製圖表,案例來自Qt自帶的demo。

charts模組簡介:Qt Chars模組提供了一系列容易使用的圖表元件。需要使用charts元件時,需要匯入Qt Charts模組,通過如下方式:QT += charts

在安裝Qt Creator的時候,需要勾選上這個模組,不然是不能使用的。

2 Qt Charts總覽

Qt Chars支援繪製:座標圖、柱狀圖、折線圖、餅圖、曲線圖、散點圖等。

3 測試及說明

首先建立一個工程,繼承至MainWindow元件。

(1)繪製折線圖

折線圖通過線段展示一系列相關聯的點。

使用的類:QLineSeries

測試程式碼:

 1 MainWindow::MainWindow(QWidget *parent) :
 2     QMainWindow(parent),
 3     ui(new Ui::MainWindow)
 4 {
 5     ui->setupUi(this);
 6 
 7     /*
 8      * LineChart Example
 9      */
10     //新增一個QLineSeries例項
11     QLineSeries *lineseries = new QLineSeries();
12     //新增資料(點),有兩種方式
13     lineseries->append(0
, 6); //引數分別為橫縱座標 14 lineseries->append(2, 4); 15 lineseries->append(3, 8); 16 lineseries->append(7, 4); 17 *lineseries << QPointF(11, 1) << QPointF(13, 3) << QPointF(17, 6) << QPointF(18, 3) << QPointF(20, 2); 18 //新增一個QChart例項,為了展示資料 19 QChart *chart = new
QChart(); 20 chart->legend()->hide(); //隱藏圖例 21 chart->addSeries(lineseries); 22 chart->createDefaultAxes(); 23 chart->setTitle("Simple line chart example"); 24 //新增一個QChartView圖例 25 QChartView *chartView = new QChartView(chart); 26 chartView->setRenderHint(QPainter::Antialiasing); //呈現方式 27 //顯示 28 this->setCentralWidget(chartView); 29 this->setCentralWidget(chartView); 30 this->resize(400, 300); 31 this->show(); 32 }

執行測試:

(2)繪製曲線圖

使用的類:QSplineSeries

測試程式碼:

 1     QSplineSeries *series = new QSplineSeries();
 2     series->setName("spline");
 3     series->append(0, 6);
 4     series->append(2, 4);
 5     series->append(3, 8);
 6     series->append(7, 4);
 7     series->append(10, 5);
 8 
 9     QChart *chart = new QChart();
10     chart->legend()->hide();
11     chart->addSeries(series);
12     chart->setTitle("Simple spline chart example");
13     chart->createDefaultAxes();
14     chart->axisY()->setRange(0, 10);
15 
16     QChartView *chartView = new QChartView(chart);
17     chartView->setRenderHint(QPainter::Antialiasing);
18 
19     this->setCentralWidget(chartView);
20     this->setCentralWidget(chartView);
21     this->resize(400, 300);
22     this->show();

執行測試:

(3)繪製面積圖

使用的類:LineChart

測試程式碼:

 1     QLineSeries *series0 = new QLineSeries();
 2     QLineSeries *series1 = new QLineSeries();
 3     *series0 << QPointF(1, 5) << QPointF(3, 7) << QPointF(7, 6) << QPointF(9, 7) << QPointF(12, 6)
 4              << QPointF(16, 7) << QPointF(18, 5);
 5     *series1 << QPointF(1, 3) << QPointF(3, 4) << QPointF(7, 3) << QPointF(8, 2) << QPointF(12, 3)
 6              << QPointF(16, 4) << QPointF(18, 3);
 7 
 8     QAreaSeries *series = new QAreaSeries(series0, series1);
 9     series->setName("Batman");
10     QPen pen(0x059605);
11     pen.setWidth(3);
12     series->setPen(pen);
13 
14     QChart *chart = new QChart();
15     chart->addSeries(series);
16     chart->setTitle("Simple areachart example");
17     chart->createDefaultAxes();
18     chart->axisX()->setRange(0, 20);
19     chart->axisY()->setRange(0, 10);
20 
21     QChartView *chartView = new QChartView(chart);
22     chartView->setRenderHint(QPainter::Antialiasing);
23 
24     this->setCentralWidget(chartView);
25     this->setCentralWidget(chartView);
26     this->resize(400, 300);
27     this->show();

執行測試:

(4)繪製散點圖

使用的類:QScatterSeries

測試程式碼:

 1     QScatterSeries *series0 = new QScatterSeries();
 2     series0->setName("scatter1");
 3     series0->setMarkerShape(QScatterSeries::MarkerShapeCircle);
 4     series0->setMarkerSize(5.0);
 5 
 6     QScatterSeries *series1 = new QScatterSeries();
 7     series1->setName("scatter2");
 8     series1->setMarkerShape(QScatterSeries::MarkerShapeRectangle);
 9     series1->setMarkerSize(10.0);
10 
11     QScatterSeries *series2 = new QScatterSeries();
12     series2->setName("scatter3");
13     series2->setMarkerShape(QScatterSeries::MarkerShapeRectangle);
14     series2->setMarkerSize(15.0);
15 
16     series0->append(0, 6);
17     series0->append(2, 4);
18     series0->append(3, 8);
19     series0->append(7, 4);
20     series0->append(10, 5);
21     *series1 << QPointF(1, 1) << QPointF(3, 3) << QPointF(7, 6) << QPointF(8, 3) << QPointF(10, 2);
22     *series2 << QPointF(1, 5) << QPointF(4, 6) << QPointF(6, 3) << QPointF(9, 5);
23 
24     QChart *chart = new QChart();
25     chart->addSeries(series0);
26     chart->addSeries(series1);
27     chart->addSeries(series2);
28     chart->setTitle("Simple scatterchart example");
29     chart->createDefaultAxes();
30     chart->setDropShadowEnabled(false);
31 
32     QChartView *chartView = new QChartView(chart);
33     chartView->setRenderHint(QPainter::Antialiasing);
34 
35     this->setCentralWidget(chartView);
36     this->resize(400, 300);
37     this->show();

執行測試:

(5)繪製柱狀圖

使用的類:QBarSeries

測試程式碼:

 1     QBarSet *set0 = new QBarSet("Jane");
 2     QBarSet *set1 = new QBarSet("John");
 3     QBarSet *set2 = new QBarSet("Axel");
 4     QBarSet *set3 = new QBarSet("Mary");
 5     QBarSet *set4 = new QBarSet("Samantha");
 6 
 7     *set0 << 1 << 2 << 3 << 4 << 5 << 6;
 8     *set1 << 5 << 0 << 0 << 4 << 0 << 7;
 9     *set2 << 3 << 5 << 8 << 13 << 8 << 5;
10     *set3 << 5 << 6 << 7 << 3 << 4 << 5;
11     *set4 << 9 << 7 << 5 << 3 << 1 << 2;
12 
13     QBarSeries *series = new QBarSeries();
14     series->append(set0);
15     series->append(set1);
16     series->append(set2);
17     series->append(set3);
18     series->append(set4);
19 
20     QChart *chart = new QChart();
21     chart->addSeries(series);
22     chart->setTitle("Simple barchart example");
23     chart->setAnimationOptions(QChart::SeriesAnimations);
24 
25     QStringList categories;
26     categories << "Jan" << "Feb" << "Mar" << "Apr" << "May" << "Jun";
27     QBarCategoryAxis *axis = new QBarCategoryAxis();
28     axis->append(categories);
29     chart->createDefaultAxes();
30     chart->setAxisX(axis, series);
31 
32     chart->legend()->setVisible(true);
33     chart->legend()->setAlignment(Qt::AlignBottom);
34 
35     QChartView *chartView = new QChartView(chart);
36     chartView->setRenderHint(QPainter::Antialiasing);
37 
38     this->setCentralWidget(chartView);
39     this->resize(400, 300);
40     this->show();

執行測試:

(6)繪製餅圖

使用的類:QPieSeries

測試程式碼:

 1     QPieSeries *series = new QPieSeries();
 2     series->append("Jane", 1);
 3     series->append("Joe", 2);
 4     series->append("Andy", 3);
 5     series->append("Barbara", 4);
 6     series->append("Axel", 5);
 7 
 8     QPieSlice *slice = series->slices().at(1);
 9     slice->setExploded();
10     slice->setLabelVisible();
11     slice->setPen(QPen(Qt::darkGreen, 2));
12     slice->setBrush(Qt::green);
13 
14     QChart *chart = new QChart();
15     chart->addSeries(series);
16     chart->setTitle("Simple piechart example");
17     chart->legend()->hide();
18 
19     QChartView *chartView = new QChartView(chart);
20     chartView->setRenderHint(QPainter::Antialiasing);
21 
22     this->setCentralWidget(chartView);
23     this->resize(400, 300);
24     this->show();

執行測試:

完整的測試程式碼:

  1 #include "mainwindow.h"
  2 #include "ui_mainwindow.h"
  3 #include <QtCharts>
  4 #include <QPainter>
  5 #include <QPainterPath>
  6 #include <QtMath>
  7 #include <QImage>
  8 
  9 MainWindow::MainWindow(QWidget *parent) :
 10     QMainWindow(parent),
 11     ui(new Ui::MainWindow)
 12 {
 13     ui->setupUi(this);
 14 
 15 #if 0
 16     /*
 17      * LineChart Example
 18      */
 19     //新增一個QLineSeries例項
 20     QLineSeries *lineseries = new QLineSeries();
 21     //新增資料(點),有兩種方式
 22     lineseries->append(0, 6);  //引數分別為橫縱座標
 23     lineseries->append(2, 4);
 24     lineseries->append(3, 8);
 25     lineseries->append(7, 4);
 26     *lineseries << QPointF(11, 1) << QPointF(13, 3) << QPointF(17, 6) << QPointF(18, 3) << QPointF(20, 2);
 27     //新增一個QChart例項,為了展示資料
 28     QChart *chart = new QChart();
 29     chart->legend()->hide();  //隱藏圖例
 30     chart->addSeries(lineseries);
 31     chart->createDefaultAxes();
 32     chart->setTitle("Simple line chart example");
 33     //新增一個QChartView圖例
 34     QChartView *chartView = new QChartView(chart);
 35     chartView->setRenderHint(QPainter::Antialiasing);  //呈現方式
 36     //顯示
 37     this->setCentralWidget(chartView);
 38     this->setCentralWidget(chartView);
 39     this->resize(400, 300);
 40     this->show();
 41 #endif
 42 
 43 #if 0
 44     /*
 45      * SplineChart Example
 46     */
 47     QSplineSeries *series = new QSplineSeries();
 48     series->setName("spline");
 49     series->append(0, 6);
 50     series->append(2, 4);
 51     series->append(3, 8);
 52     series->append(7, 4);
 53     series->append(10, 5);
 54 
 55     QChart *chart = new QChart();
 56     chart->legend()->hide();
 57     chart->addSeries(series);
 58     chart->setTitle("Simple spline chart example");
 59     chart->createDefaultAxes();
 60     chart->axisY()->setRange(0, 10);
 61 
 62     QChartView *chartView = new QChartView(chart);
 63     chartView->setRenderHint(QPainter::Antialiasing);
 64 
 65     this->setCentralWidget(chartView);
 66     this->setCentralWidget(chartView);
 67     this->resize(400, 300);
 68     this->show();
 69 #endif
 70 
 71 #if 0
 72     /*
 73     * AreaChart Example
 74     */
 75     QLineSeries *series0 = new QLineSeries();
 76     QLineSeries *series1 = new QLineSeries();
 77     *series0 << QPointF(1, 5) << QPointF(3, 7) << QPointF(7, 6) << QPointF(9, 7) << QPointF(12, 6)
 78              << QPointF(16, 7) << QPointF(18, 5);
 79     *series1 << QPointF(1, 3) << QPointF(3, 4) << QPointF(7, 3) << QPointF(8, 2) << QPointF(12, 3)
 80              << QPointF(16, 4) << QPointF(18, 3);
 81 
 82     QAreaSeries *series = new QAreaSeries(series0, series1);
 83     series->setName("Batman");
 84     QPen pen(0x059605);
 85     pen.setWidth(3);
 86     series->setPen(pen);
 87 
 88     QChart *chart = new QChart();
 89     chart->addSeries(series);
 90     chart->setTitle("Simple areachart example");
 91     chart->createDefaultAxes();
 92     chart->axisX()->setRange(0, 20);
 93     chart->axisY()->setRange(0, 10);
 94 
 95     QChartView *chartView = new QChartView(chart);
 96     chartView->setRenderHint(QPainter::Antialiasing);
 97 
 98     this->setCentralWidget(chartView);
 99     this->setCentralWidget(chartView);
100     this->resize(400, 300);
101     this->show();
102 #endif
103 
104 #if 0
105     /*
106     * QScatterChart Example
107     */
108     QScatterSeries *series0 = new QScatterSeries();
109     series0->setName("scatter1");
110     series0->setMarkerShape(QScatterSeries::MarkerShapeCircle);
111     series0->setMarkerSize(5.0);
112 
113     QScatterSeries *series1 = new QScatterSeries();
114     series1->setName("scatter2");
115     series1->setMarkerShape(QScatterSeries::MarkerShapeRectangle);
116     series1->setMarkerSize(10.0);
117 
118     QScatterSeries *series2 = new QScatterSeries();
119     series2->setName("scatter3");
120     series2->setMarkerShape(QScatterSeries::MarkerShapeRectangle);
121     series2->setMarkerSize(15.0);
122 
123     series0->append(0, 6);
124     series0->append(2, 4);
125     series0->append(3, 8);
126     series0->append(7, 4);
127     series0->append(10, 5);
128     *series1 << QPointF(1, 1) << QPointF(3, 3) << QPointF(7, 6) << QPointF(8, 3) << QPointF(10, 2);
129     *series2 << QPointF(1, 5) << QPointF(4, 6) << QPointF(6, 3) << QPointF(9, 5);
130 
131     QChart *chart = new QChart();
132     chart->addSeries(series0);
133     chart->addSeries(series1);
134     chart->addSeries(series2);
135     chart->setTitle("Simple scatterchart example");
136     chart->createDefaultAxes();
137     chart->setDropShadowEnabled(false);
138 
139     QChartView *chartView = new QChartView(chart);
140     chartView->setRenderHint(QPainter::Antialiasing);
141 
142     this->setCentralWidget(chartView);
143     this->resize(400, 300);
144     this->show();
145 #endif
146 
147 #if 0
148     /*
149     * BarChart Example
150     */
151     QBarSet *set0 = new QBarSet("Jane");
152     QBarSet *set1 = new QBarSet("John");
153     QBarSet *set2 = new QBarSet("Axel");
154     QBarSet *set3 = new QBarSet("Mary");
155     QBarSet *set4 = new QBarSet("Samantha");
156 
157     *set0 << 1 << 2 << 3 << 4 << 5 << 6;
158     *set1 << 5 << 0 << 0 << 4 << 0 << 7;
159     *set2 << 3 << 5 << 8 << 13 << 8 << 5;
160     *set3 << 5 << 6 << 7 << 3 << 4 << 5;
161     *set4 << 9 << 7 << 5 << 3 << 1 << 2;
162 
163     QBarSeries *series = new QBarSeries();
164     series->append(set0);
165     series->append(set1);
166     series->append(set2);
167     series->append(set3);
168     series->append(set4);
169 
170     QChart *chart = new QChart();
171     chart->addSeries(series);
172     chart->setTitle("Simple barchart example");
173     chart->setAnimationOptions(QChart::SeriesAnimations);
174 
175     QStringList categories;
176     categories << "Jan" << "Feb" << "Mar" << "Apr" << "May" << "Jun";
177     QBarCategoryAxis *axis = new QBarCategoryAxis();
178     axis->append(categories);
179     chart->createDefaultAxes();
180     chart->setAxisX(axis, series);
181 
182     chart->legend()->setVisible(true);
183     chart->legend()->setAlignment(Qt::AlignBottom);
184 
185     QChartView *chartView = new QChartView(chart);
186     chartView->setRenderHint(QPainter::Antialiasing);
187 
188     this->setCentralWidget(chartView);
189     this->resize(400, 300);
190     this->show();
191 #endif
192 
193 #if 0
194     /*
195     * Piechart Example
196     */
197     QPieSeries *series = new QPieSeries();
198     series->append("Jane", 1);
199     series->append("Joe", 2);
200     series->append("Andy", 3);
201     series->append("Barbara", 4);
202     series->append("Axel", 5);
203 
204     QPieSlice *slice = series->slices().at(1);
205     slice->setExploded();
206     slice->setLabelVisible();
207     slice->setPen(QPen(Qt::darkGreen, 2));
208     slice->setBrush(Qt::green);
209 
210     QChart *chart = new QChart();
211     chart->addSeries(series);
212     chart->setTitle("Simple piechart example");
213     chart->legend()->hide();
214 
215     QChartView *chartView = new QChartView(chart);
216     chartView->setRenderHint(QPainter::Antialiasing);
217 
218     this->setCentralWidget(chartView);
219     this->resize(400, 300);
220     this->show();
221 #endif
222 }
223 
224 MainWindow::~MainWindow()
225 {
226     delete ui;
227 }
View Code

還有一些圖形及主題等設定,後續待補充。