目录
QChart的继承关系
基本组件和概念
常见图表类型及其系列类
常用的图表配置
一、折线图示例
二、柱状图示例
三、饼图示例
四、类波形图(折线图)示例
QChart 模块提供了直观的图表绘制接口,支持创建各种常见的图表类型,如柱状图、折线图、饼图等。QChart主要应用于数据可视化,使得用户可以快速展示和分析数据。
QChart的继承关系
基本组件和概念
在 Qt Charts 模块中,常用的类包括:
QChart:图表的主体类,用于管理和显示各种图表系列。
QChartView:QWidget 的子类,用于将 QChart 显示在窗口上。
QSeries:每种图表类型都有相应的系列类,比如 QLineSeries、QBarSeries、QPieSeries 等,用于添加和管理特定类型的数据。
- 要想在项目里使用 Qt Charts 模块,需要在 pro 文件下添加以下语句。
QT += charts
- 如果我们点击查看 Qt Charts 类,我们可以看到要想使用 Qt Charts 类,除了需要包括相应的头文件外,还需要使用命名空间。格式如下。
- 一般在头文件处加上这个。
QT_CHARTS_USE_NAMESPACE
- 或者在头文件类外加上以下语句。
using namespace QtCharts;
常见图表类型及其系列类
-
折线图(Line Chart):使用
QLineSeries
类。 -
柱状图(Bar Chart):使用
QBarSeries
、QBarSet
等类。 -
饼图(Pie Chart):使用
QPieSeries
。 -
散点图(Scatter Chart):使用
QScatterSeries
。 -
面积图(Area Chart):使用
QAreaSeries
。
常用的图表配置
1. 设置轴
- 可以使用
QValueAxis
或QCategoryAxis
自定义坐标轴。
#include <QtCharts/QValueAxis>
QValueAxis *axisX = new QValueAxis();
axisX->setRange(0, 10);
axisX->setTitleText("X Axis");
QValueAxis *axisY = new QValueAxis();
axisY->setRange(0, 10);
axisY->setTitleText("Y Axis");
chart->setAxisX(axisX, lineSeries);
chart->setAxisY(axisY, lineSeries);
2. 设置图例
chart->legend()->setVisible(true);
chart->legend()->setAlignment(Qt::AlignBottom);
3. 图表样式
- 可以调整颜色、线条、字体等。
lineSeries->setColor(Qt::blue);
chart->setTitleFont(QFont("Arial", 14, QFont::Bold));
一、折线图示例
mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QMainWindow>
#include <QChartView>
#include <QLineSeries>
// 必需添加命名空间
QT_CHARTS_USE_NAMESPACE
class MainWindow : public QMainWindow
{
Q_OBJECT
public:
MainWindow(QWidget *parent = nullptr);
~MainWindow();
private:
QLineSeries *splineSeries;
QChart *chart;
QChartView *chartView;
};
#endif // MAINWINDOW_H
mainwindow.c
#include "mainwindow.h"
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
{
this->setGeometry(0, 0, 800, 480);
splineSeries = new QLineSeries();
// 添加坐标点
splineSeries->append(0, 6);
splineSeries->append(2, 4);
splineSeries->append(3, 8);
splineSeries->append(7, 4);
splineSeries->append(10, 5);
chart = new QChart();
chart->addSeries(splineSeries);
chart->setTitle("Simple Line Chart Example");
chart->createDefaultAxes(); //自动生成默认坐标轴
chartView = new QChartView(chart);
chartView->setChart(chart); // 将图表的内容设置在图表视图上
chartView->setRenderHint(QPainter::Antialiasing); // 设置抗锯齿
setCentralWidget(chartView); // 设置为图表视图为中心部件
}
MainWindow::~MainWindow() {
}
运行效果:
二、柱状图示例
mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QMainWindow>
#include <QBarSeries>
#include <QBarSet>
#include <QChartView>
// 必需添加命名空间
QT_CHARTS_USE_NAMESPACE
class MainWindow : public QMainWindow
{
Q_OBJECT
public:
MainWindow(QWidget *parent = nullptr);
~MainWindow();
private:
QBarSet *set0;
QBarSet *set1;
QBarSeries *barSeries;
QChart *chart;
QChartView *chartView;
};
#endif // MAINWINDOW_H
mainwindow.c
#include "mainwindow.h"
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
{
this->setGeometry(0, 0, 800, 480);
set0 = new QBarSet("Jane");
set1 = new QBarSet("John");
// 向容器中追加元素
*set0 << 1 << 2 << 3 << 4 << 5 << 6;
*set1 << 5 << 0 << 0 << 4 << 0 << 7;
barSeries = new QBarSeries();
barSeries->append(set0);
barSeries->append(set1);
chart = new QChart();
chart->addSeries(barSeries);
chart->setTitle("Simple Bar Chart Example");
chart->setAnimationOptions(QChart::SeriesAnimations); // 增加动画效果,使数据加载、更新时有更流畅的过渡
chartView = new QChartView(chart);
chartView->setChart(chart); // 将图表的内容设置在图表视图上
chartView->setRenderHint(QPainter::Antialiasing); // 设置抗锯齿
setCentralWidget(chartView); // 设置为图表视图为中心部件
}
MainWindow::~MainWindow()
{
}
<<
操作符将一系列整数添加到两个集合或容器对象中,可能用于表示数据序列或某种集合操作。这种语法通常用于 QSet
、QVector
、QList
等 Qt 容器类型。
运行效果:
三、饼图示例
mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QMainWindow>
#include <QChartView>
#include <QPieSeries>
// 必需添加命名空间
QT_CHARTS_USE_NAMESPACE
class MainWindow : public QMainWindow
{
Q_OBJECT
public:
MainWindow(QWidget *parent = nullptr);
~MainWindow();
private:
QPieSeries *pieSeries;
QChart *chart;
QChartView *chartView;
};
#endif // MAINWINDOW_H
mainwindow.c
#include "mainwindow.h"
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
{
this->setGeometry(0, 0, 800, 480);
pieSeries = new QPieSeries();
pieSeries->append("Apple", 10);
pieSeries->append("Banana", 20);
pieSeries->append("Cherry", 30);
pieSeries->append("Date", 40);
chart = new QChart();
chart->addSeries(pieSeries);
chart->setTitle("Simple Pie Chart Example");
chartView = new QChartView(chart);
chartView->setChart(chart); // 将图表的内容设置在图表视图上
chartView->setRenderHint(QPainter::Antialiasing); // 设置抗锯齿
setCentralWidget(chartView); // 设置为图表视图为中心部件
}
MainWindow::~MainWindow()
{
}
运行效果:
四、类波形图(折线图)示例
mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
#include <QChartView>
#include <QSplineSeries>
#include <QDebug>
#include <QValueAxis>
#include <QTimer>
#include <QMainWindow>
// 必需添加命名空间
QT_CHARTS_USE_NAMESPACE
class MainWindow : public QMainWindow
{
Q_OBJECT
public:
MainWindow(QWidget *parent = nullptr);
~MainWindow();
private:
void receivedData(int);
int maxSize;
int maxX;
int maxY;
QValueAxis *axisY;
QValueAxis *axisX;
QList<int> data;
QSplineSeries *splineSeries;
QChart *chart;
QChartView *chartView;
QTimer *timer;
private slots:
void timerTimeOut();
};
#endif // MAINWINDOW_H
mainwindow.c
#include "mainwindow.h"
MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
{
this->setGeometry(0, 0, 800, 480);
maxSize = 51; // 最大储存maxSize - 1个数据
maxX = 5000; // x轴上的最大值
maxY = 40; // y轴上的最大值
splineSeries = new QSplineSeries(); // splineSeries曲线实例化(折线用QLineSeries)
chart = new QChart(); // 图表实例化
chartView = new QChartView(); // 图表视图实例化
// 坐标轴
axisY = new QValueAxis();
axisX = new QValueAxis();
// 定时器
timer = new QTimer(this);
chart->legend()->hide(); /* legend译图例类型,以绘图的颜色区分,本例设置为隐藏 */
chart->setTitle("实时动态曲线示例"); // chart设置标题
chart->addSeries(splineSeries); // 添加一条曲线splineSeries
axisY->setLabelFormat("%i"); // 设置显示格式
axisY->setTitleText("温度/℃"); // 标题
chart->addAxis(axisY, Qt::AlignLeft); // 标题位置(设置坐标轴的方向)
axisY->setRange(0, maxY); // 范围
splineSeries->attachAxis(axisY); // 将splineSeries附加于y轴上
axisX->setLabelFormat("%i");
axisX->setTitleText("时间/ms");
chart->addAxis(axisX, Qt::AlignBottom);
axisX->setRange(0, maxX);
splineSeries->attachAxis(axisX); // 将splineSeries附加于x轴上 */
chartView->setChart(chart); // 将图表的内容设置在图表视图上
chartView->setRenderHint(QPainter::Antialiasing); // 设置抗锯齿
setCentralWidget(chartView); // 设置为图表视图为中心部件
timer->start(100); // 定时100ms
connect(timer, SIGNAL(timeout()), this, SLOT(timerTimeOut()));
qsrand(time(NULL)); // 设置随机种子,随机数初始化
}
MainWindow::~MainWindow() {
}
void MainWindow::timerTimeOut() {
receivedData(qrand() % maxY ); // 产生随机0~maxY之间的数据
}
void MainWindow::receivedData(int value) {
data.append(value); // 将数据添加到data中
// 当储存数据的个数大于最大值时,把第一个数据删除
while (data.size() > maxSize) {
data.removeFirst();
}
splineSeries->clear();
int xSpace = maxX / (maxSize - 1); // 计算x轴上间距
// 添加点,xSpace * i 表示第i个点的x轴的位置
for (int i = 0; i < data.size(); ++i) {
splineSeries->append(xSpace * i, data.at(i));
}
}
splineSeries->clear():
是一个用于清空 QSplineSeries
对象中的所有数据点的函数。
运行效果: