效果
折线图
// 创建折线数据系列// 创建折线系列QLineSeries *series = new QLineSeries;// series->append(0, 6);// series->append(2, 4);// series->append(3, 8);// 创建图表并添加系列QChart *chart = new QChart;chart->addSeries(series);chart->setTitle("实时数据监控");chart->setAnimationOptions(QChart::SeriesAnimations); // 启用动画// 显式创建轴(Qt6 兼容)QValueAxis *axisX = new QValueAxis;QValueAxis *axisY = new QValueAxis;chart->addAxis(axisX, Qt::AlignBottom);chart->addAxis(axisY, Qt::AlignLeft);series->attachAxis(axisX);series->attachAxis(axisY);axisX->setTitleText("时间");axisY->setTitleText("数值");axisX->setRange(0, 10);//设置范围axisY->setRange(0, 100);// 将图表嵌入到 QChartView 中显示// QChartView *chartView = new QChartView(chart);// chartView->setRenderHint(QPainter::Antialiasing); // 抗锯齿// chartView->resize(800, 600);//this->setCentralWidget(chartView);//代码中绑定到布局//ui->verticalLayout->addWidget(chartView); // 添加到布局ui->chartViewLine->setChart(chart);ui->chartViewLine->setRenderHint(QPainter::Antialiasing); // 抗锯齿// 动态更新数据// 定时器动态追加数据QTimer *timer = new QTimer(this);QObject::connect(timer, &QTimer::timeout, [=]() {static int currentX = 0;// 当前数据点的 X 值//动态添加数据series->append(currentX, QRandomGenerator::global()->bounded(100));axisX->setMax(currentX); // 自动扩展 X 轴范围// 控制数据量不超过30个// if (series->count() > 30) {// series->remove(0); // 移除最旧的点// }// // 动态调整 X 轴范围,显示最近30个点// if (currentX >= 30) {// axisX->setRange(currentX - 29, currentX);// } else {// axisX->setRange(0, currentX);// }if(currentX > max_x){series->removePoints(0,series->count() - max_x);axisX->setMin(currentX - max_x + 1);}currentX++;});timer->start(1000); // 每秒添加一个点
柱状图
//创建柱状图(Bar Chart)QBarSet *set0 = new QBarSet("数据A");QBarSet *set1 = new QBarSet("数据B");*set0 << 1 << 2 << 3 << 4 << 5;*set1 << 5 << 4 << 3 << 2 << 1;QBarSeries *seriesBar = new QBarSeries();seriesBar->append(set0);seriesBar->append(set1);QChart *chartBar = new QChart();chartBar->addSeries(seriesBar);chartBar->setTitle("柱状图示例");chartBar->setAnimationOptions(QChart::SeriesAnimations); // 启用动画// 设置分类轴QStringList categories {"Jan", "Feb", "Mar", "Apr", "May"};QBarCategoryAxis *axisXBar = new QBarCategoryAxis();axisXBar->append(categories);chartBar->addAxis(axisXBar, Qt::AlignBottom);seriesBar->attachAxis(axisXBar);// 显示// QChartView *chartViewBar = new QChartView(chart);// chartViewBar->show();ui->chartViewBar->setChart(chartBar);ui->chartViewBar->show();
饼状图
// 创建饼图系列QPieSeries *seriesPie = new QPieSeries();seriesPie->append("Apple", 30); // 添加数据切片seriesPie->append("Banana", 20);seriesPie->append("Orange", 50);// 自定义切片样式(可选)for (QPieSlice *slice : seriesPie->slices()) {slice->setLabelVisible(true); // 显示标签slice->setLabelColor(Qt::black); // 标签颜色slice->setLabelPosition(QPieSlice::LabelOutside); // 标签位置}// 创建图表并添加系列QChart *chartPie = new QChart();chartPie->addSeries(seriesPie);chartPie->setTitle("饼图标题"); // 图表标题chartPie->legend()->setVisible(true); // 显示图例chartPie->legend()->setAlignment(Qt::AlignRight); // 图例位置// 显示图表ui->chartViewPie->setChart(chartPie);ui->chartViewPie->setRenderHint(QPainter::Antialiasing); // 抗锯齿
UI
引用
QT += charts
完整代码
头文件
#ifndef MAINWINDOW_H
#define MAINWINDOW_H
// 在头文件或源文件的最顶部定义宏
//#define QT_CHARTS_USE_NAMESPACE
#include <QtCharts>
#include <QtCharts/QChartView>
#include <QtCharts/QSplineSeries>
#include <QValueAxis>
#include <QMainWindow>//QT_CHARTS_USE_NAMESPACEQT_BEGIN_NAMESPACE
namespace Ui {
class MainWindow;
}
QT_END_NAMESPACEclass MainWindow : public QMainWindow
{Q_OBJECTpublic:MainWindow(QWidget *parent = nullptr);~MainWindow();private:Ui::MainWindow *ui;void initChart();int qrand();int max_x = 30;
};
#endif // MAINWINDOW_H
cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QtCharts>
#include <QtCharts/QChartView>
#include <QtCharts/QSplineSeries>
#include <QValueAxis>MainWindow::MainWindow(QWidget *parent): QMainWindow(parent), ui(new Ui::MainWindow)
{ui->setupUi(this);initChart();}MainWindow::~MainWindow()
{delete ui;
}void MainWindow::initChart()
{// 创建折线数据系列// 创建折线系列QLineSeries *series = new QLineSeries;// series->append(0, 6);// series->append(2, 4);// series->append(3, 8);// 创建图表并添加系列QChart *chart = new QChart;chart->addSeries(series);chart->setTitle("实时数据监控");chart->setAnimationOptions(QChart::SeriesAnimations); // 启用动画// 显式创建轴(Qt6 兼容)QValueAxis *axisX = new QValueAxis;QValueAxis *axisY = new QValueAxis;chart->addAxis(axisX, Qt::AlignBottom);chart->addAxis(axisY, Qt::AlignLeft);series->attachAxis(axisX);series->attachAxis(axisY);axisX->setTitleText("时间");axisY->setTitleText("数值");axisX->setRange(0, 10);//设置范围axisY->setRange(0, 100);// 将图表嵌入到 QChartView 中显示// QChartView *chartView = new QChartView(chart);// chartView->setRenderHint(QPainter::Antialiasing); // 抗锯齿// chartView->resize(800, 600);//this->setCentralWidget(chartView);//代码中绑定到布局//ui->verticalLayout->addWidget(chartView); // 添加到布局ui->chartViewLine->setChart(chart);ui->chartViewLine->setRenderHint(QPainter::Antialiasing); // 抗锯齿// 动态更新数据// 定时器动态追加数据QTimer *timer = new QTimer(this);QObject::connect(timer, &QTimer::timeout, [=]() {static int currentX = 0;// 当前数据点的 X 值//动态添加数据series->append(currentX, QRandomGenerator::global()->bounded(100));axisX->setMax(currentX); // 自动扩展 X 轴范围// 控制数据量不超过30个// if (series->count() > 30) {// series->remove(0); // 移除最旧的点// }// // 动态调整 X 轴范围,显示最近30个点// if (currentX >= 30) {// axisX->setRange(currentX - 29, currentX);// } else {// axisX->setRange(0, currentX);// }if(currentX > max_x){series->removePoints(0,series->count() - max_x);axisX->setMin(currentX - max_x + 1);}currentX++;});timer->start(1000); // 每秒添加一个点//创建柱状图(Bar Chart)QBarSet *set0 = new QBarSet("数据A");QBarSet *set1 = new QBarSet("数据B");*set0 << 1 << 2 << 3 << 4 << 5;*set1 << 5 << 4 << 3 << 2 << 1;QBarSeries *seriesBar = new QBarSeries();seriesBar->append(set0);seriesBar->append(set1);QChart *chartBar = new QChart();chartBar->addSeries(seriesBar);chartBar->setTitle("柱状图示例");chartBar->setAnimationOptions(QChart::SeriesAnimations); // 启用动画// 设置分类轴QStringList categories {"Jan", "Feb", "Mar", "Apr", "May"};QBarCategoryAxis *axisXBar = new QBarCategoryAxis();axisXBar->append(categories);chartBar->addAxis(axisXBar, Qt::AlignBottom);seriesBar->attachAxis(axisXBar);// 显示// QChartView *chartViewBar = new QChartView(chart);// chartViewBar->show();ui->chartViewBar->setChart(chartBar);ui->chartViewBar->show();// 创建饼图系列QPieSeries *seriesPie = new QPieSeries();seriesPie->append("Apple", 30); // 添加数据切片seriesPie->append("Banana", 20);seriesPie->append("Orange", 50);// 自定义切片样式(可选)for (QPieSlice *slice : seriesPie->slices()) {slice->setLabelVisible(true); // 显示标签slice->setLabelColor(Qt::black); // 标签颜色slice->setLabelPosition(QPieSlice::LabelOutside); // 标签位置}// 创建图表并添加系列QChart *chartPie = new QChart();chartPie->addSeries(seriesPie);chartPie->setTitle("饼图标题"); // 图表标题chartPie->legend()->setVisible(true); // 显示图例chartPie->legend()->setAlignment(Qt::AlignRight); // 图例位置// 显示图表ui->chartViewPie->setChart(chartPie);ui->chartViewPie->setRenderHint(QPainter::Antialiasing); // 抗锯齿
}
关键类说明
-
QPieSeries
- 用于管理饼图的所有切片(
QPieSlice
)。 - 通过
append(name, value)
添加数据。
- 用于管理饼图的所有切片(
-
QPieSlice
- 控制单个切片的属性,如颜色、标签、突出显示等。
- 常用方法:
setLabelVisible()
,setColor()
,setExploded()
(突出显示)。
-
QChart
- 管理图表布局、标题、图例等。
- 通过
addSeries()
添加数据系列。
-
QChartView
- 用于显示图件的 Widget,支持抗锯齿渲染。
自定义样式
-
修改颜色:
-
slice->setColor(QColor("#FF5733")); // 设置切片颜色
突出显示切片:
-
slice->setExploded(true); // 使切片突出 slice->setExplodeDistanceFactor(0.1); // 突出距离
在 Qt Charts 中,
AnimationOption
是QChart
类中用于控制图表动画效果的枚举类型,其具体定义如下: -
1. 枚举值说明
AnimationOption
包含以下选项 6: -
NoAnimation
禁用所有动画效果。 -
GridAxisAnimations
启用坐标轴网格的动画(如缩放、平移时网格渐变效果)。 -
SeriesAnimations
启用数据系列的动画(如饼图切片展开、折线图数据点渐变)。 -
AllAnimations
启用全部动画效果(等同于GridAxisAnimations | SeriesAnimations
)。 -
2. 组合使用
AnimationOptions
是QFlags<AnimationOption>
类型,支持通过位运算组合多个选项 6。例如: -
chart->setAnimationOptions(QChart::GridAxisAnimations | QChart::SeriesAnimations);
3. 应用方法
通过
QChart::setAnimationOptions()
方法设置动画效果 4,6: -
QChart *chart = new QChart(); chart->setAnimationOptions(QChart::AllAnimations); // 启用所有动画
5. 相关配置
- 动画时长:通过
QChart::setAnimationDuration()
调整动画时长(默认 1000ms)46。 - 缓动曲线:通过
QChart::setAnimationEasingCurve()
设置动画缓动效果(如弹性、加速曲线)6。 -
适用场景
- 数据动态更新时(如实时折线图),建议启用
SeriesAnimations
提升视觉效果 67。 - 静态图表中可禁用动画(
NoAnimation
)以减少性能开销 6。