Qt-绘制图表

摘要:
1简介使用Qt的图表模块绘制图表。案例来自Qt自己的演示。当您需要使用图表组件时,需要按以下方式导入QtCharts模块:QT+=图表安装QtCreator时必须检查该模块,否则无法使用。2QtCharts概述QtChart支持绘图:坐标图、直方图、折线图、饼图、曲线图、散点图等。3测试和描述首先创建项目并将其继承到MainWindow组件。绘制折线图折线图通过线段显示一系列关联点。

1  简介

使用Qt的charts模块来绘制图表,案例来自Qt自带的demo。

charts模块简介:Qt Chars模块提供了一系列容易使用的图表组件。需要使用charts组件时,需要导入Qt Charts模块,通过如下方式:QT += charts

在安装Qt Creator的时候,需要勾选上这个模块,不然是不能使用的。

2  Qt Charts总览

Qt Chars支持绘制:坐标图、柱状图、折线图、饼图、曲线图、散点图等。

Qt-绘制图表第1张

3  测试及说明

首先创建一个工程,继承至MainWindow组件。

Qt-绘制图表第2张

(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 }

运行测试:

Qt-绘制图表第3张

(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();

运行测试:

Qt-绘制图表第4张

(3)绘制面积图

使用的类:QAreaSeries 

测试代码:

 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();

运行测试:

Qt-绘制图表第5张

(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();

运行测试:

Qt-绘制图表第6张

(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();

运行测试:

Qt-绘制图表第7张

 (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();

运行测试:

Qt-绘制图表第8张

完整的测试代码:

Qt-绘制图表第9张Qt-绘制图表第10张
  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

还有一些图形及主题等设置,后续待补充。

4  其它

(1)如何在QWidget中绘制QCharts

上面的代码中都是在QMainWindow中绘制的QCharts,但如果我们要在QWidget中绘制QCharts,那么如何实现呢?

方式一:

可选择的解决方法:在ui中拖一个水平布局,把chartView放到水平布局。

Qt-绘制图表第11张

测试代码:

 1 Widget::Widget(QWidget *parent) :
 2     QWidget(parent),
 3     ui(new Ui::Widget)
 4 {
 5     ui->setupUi(this);
 6 
 7     /*
 8     * BarChart Example
 9     */
10     QBarSet *set0 = new QBarSet("Jane");
11     QBarSet *set1 = new QBarSet("John");
12     QBarSet *set2 = new QBarSet("Axel");
13     QBarSet *set3 = new QBarSet("Mary");
14     QBarSet *set4 = new QBarSet("Samantha");
15 
16     *set0 << 1 << 2 << 3 << 4 << 5 << 6;
17     *set1 << 5 << 0 << 0 << 4 << 0 << 7;
18     *set2 << 3 << 5 << 8 << 13 << 8 << 5;
19     *set3 << 5 << 6 << 7 << 3 << 4 << 5;
20     *set4 << 9 << 7 << 5 << 3 << 1 << 2;
21 
22     QBarSeries *series = new QBarSeries();
23     series->append(set0);
24     series->append(set1);
25     series->append(set2);
26     series->append(set3);
27     series->append(set4);
28 
29     QChart *chart = new QChart();
30     chart->addSeries(series);
31     chart->setTitle("Simple barchart example");
32     chart->setAnimationOptions(QChart::SeriesAnimations);
33 
34     QStringList categories;
35     categories << "Jan" << "Feb" << "Mar" << "Apr" << "May" << "Jun";
36     QBarCategoryAxis *axis = new QBarCategoryAxis();
37     axis->append(categories);
38     chart->createDefaultAxes();
39     chart->setAxisX(axis, series);
40 
41     chart->legend()->setVisible(true);
42     chart->legend()->setAlignment(Qt::AlignBottom);
43 
44     QChartView *chartView = new QChartView(chart);
45     chartView->setRenderHint(QPainter::Antialiasing);
46 
47     ui->horizontalLayout->addWidget(chartView);
48 }

运行测试:

Qt-绘制图表第12张

 这种方式每次是在水平布局中添加一个QWidget,有时候不太好用。

方式二:

将QWidget提升为QChartView。

Qt-绘制图表第13张

在代码中直接使用下面的代码就可以显示了:

1         ui->widget_factory->setChart(chart);
2         ui->widget_factory->show();

(2)如何在柱状图中顶端带数字显示

只需要添加下面两句代码:

1     series->setLabelsPosition(QAbstractBarSeries::LabelsInsideEnd);
2     series->setLabelsVisible(true);

免责声明:文章转载自《Qt-绘制图表》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇[转]智能聊天机器人小黄鸡及其制作方法A* 寻路算法下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

Helm 入门指南

来自: https://www.hi-linux.com/posts/21466.html  官网; https://helm.sh/docs/developing_charts/ Helm 是 Kubernetes 生态系统中的一个软件包管理工具。本文将介绍 Helm 中的相关概念和基本工作原理,并通过一个具体的示例学习如何使用 Helm 打包、分发、安...

Golang的高级数据类型-切片(slice)实战篇

          Golang的高级数据类型-切片(slice)实战篇                              作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任。        切片(slice)是Go中一种比较特殊的数据结构,这种数据结构更便于使用和管理数据集合,切片是围绕动态数组的概念构建的,可以按需自动增长。   ...

shell脚本:行列转换

Mybatis中写sql,如select,会涉及到一长串列名。 `id` int(11) NOT NULL AUTO_INCREMENT, `name` varchar(100) COLLATE utf8mb4_bin, `mainImg` varchar(255) COLLATE utf8mb4_bin NOT NULL, ... 现想将table描述...

chart.js使用常见问题

Chart.js是一个简单、面向对象、为设计者和开发者准备的图表绘制工具库。 在使用过程中新手可能会遇到很多问题导致图标无法显示。下面我们来看一下在使用过程中可能会遇到的问题。 刚开始用chart.js的新手可能最先使用的就是chart.js的中文文档,根据中文文档所写的操作步骤完成操作。 首先,下载chart.js文件,通常我们从github下载。 初...

HDFS只支持文件append操作, 而依赖HDFS的HBase如何完成数据的增删改查

转:http://www.th7.cn/db/nosql/201510/135382.shtml 1. HDFS的文件append功能 早期版本的HDFS不支持任何的文件更新操作,一旦一个文件创建、写完数据、并关闭之后,这个文件就再也不能被改变了。为什么这么设计?是为了与MapReduce完美配合,MapReduce的工作模式是接受一系列输入文件,经过ma...

爬虫:通过滑动或者点触验证码的方法及实现(点触+滑动)

一、极验验证码(geetest)的三种验证模式 以极验官网登录(https://auth.geetest.com/login/)为例:  在点击 “点击按钮进行验证”按钮后,会出现三种情况 1.点击直接通过 在一段时间的前几次登录时,点击按钮,会直接通过验证: 2.点击出现滑动验证码 登录几次后,再次登录时,就会出现滑动验证码:  3.点击出现点触验...