【QT精讲】QChart别再用Excel截图了！三行代码画出专业统计图

今天学的是：柱状图、折线图、饼图 —— 让你的软件自带数据报表功能

📖 一个小故事（小牛马被老板催报表）

小牛马写了个销售数据管理系统，老板说：“你把每个月的销售额画个柱状图，我要看趋势。”小牛马第一反应是用 QPainter 画柱状图，结果折腾了两天，坐标轴没对齐，柱子的颜色也丑得一批。老板看了直摇头：“你这图还没我Excel截图好看。”小牛马哭着来找我：“羊哥，Qt 就没有现成的图表库吗？我不想重复造轮子啊！”我淡定地说：“有啊，Qt Charts 模块，专门干这个。你加一行 QT += charts，然后看我怎么三行代码给你画个柱状图。”

同学们好，我是码了只羊 —— 野生白羊座程序员，不写八股，专注用QT码点小玩意儿。

今天咱们学习 Qt Charts 模块。它提供了一套完整的图表组件，包括柱状图、折线图、饼图、散点图、面积图等，而且支持缩放、拖拽、动态更新。你再也不用手动画坐标轴了。

📌 工程配置

在 .pro 文件中必须添加：QT += charts，并在包含头文件时加上 QT_CHARTS_USE_NAMESPACE 宏。

一、最简单的柱状图（三行代码）

#include <QtCharts/QChartView>#include <QtCharts/QBarSeries>#include <QtCharts/QBarSet>#include <QtCharts/QBarCategoryAxis>QT_CHARTS_USE_NAMESPACE// 创建柱状图数据集QBarSet *set = new QBarSet("销售额");*set << 100 << 120 << 90 << 150 << 200;// 创建序列并添加数据集QBarSeries *series = new QBarSeries;series->append(set);// 创建图表QChart *chart = new QChart;chart->addSeries(series);chart->setTitle("月度销售数据");// 设置坐标轴QStringList categories = {"1月", "2月", "3月", "4月", "5月"};QBarCategoryAxis *axisX = new QBarCategoryAxis;axisX->append(categories);chart->addAxis(axisX, Qt::AlignBottom);series->attachAxis(axisX);// 显示图表QChartView *chartView = new QChartView(chart);chartView->setRenderHint(QPainter::Antialiasing);chartView->setGeometry(20, 20, 600, 400);

运行效果：一个漂亮的柱状图，有标题、坐标轴、不同颜色的柱子。小牛马看到后惊呼：“就这？三行核心代码就画出来了？”

二、折线图与多序列

折线图用来展示趋势，可以同时显示多个序列。

QLineSeries *series1 = new QLineSeries;series1->setName("实际销售额");*series1 << QPointF(1, 100) << QPointF(2, 130) << QPointF(3, 110) << QPointF(4, 160);QLineSeries *series2 = new QLineSeries;series2->setName("目标销售额");*series2 << QPointF(1, 110) << QPointF(2, 120) << QPointF(3, 130) << QPointF(4, 140);QChart *chart = new QChart;chart->addSeries(series1);chart->addSeries(series2);chart->setTitle("销售趋势对比");chart->createDefaultAxes();  // 自动创建坐标轴QChartView *view = new QChartView(chart);view->setRenderHint(QPainter::Antialiasing);

效果：两条曲线，一条实际一条目标，老板一眼就能看出有没有达标。

三、饼图与动态更新

饼图适合展示比例，可以动态更新数据。

QPieSeries *pieSeries = new QPieSeries;pieSeries->append("苹果", 30);pieSeries->append("香蕉", 20);pieSeries->append("橙子", 15);// 设置某一块突出显示QPieSlice *slice = pieSeries->slices().at(0);slice->setExploded(true);QChart *chart = new QChart;chart->addSeries(pieSeries);chart->setTitle("水果销售占比");// 动态更新数据（比如定时器）QTimer *timer = new QTimer;connect(timer, &QTimer::timeout, [=](){    int newValue = QRandomGenerator::global()->bounded(10, 50);    pieSeries->slices().at(1)->setValue(newValue);});timer->start(2000);

四、实战：实时监控仪表板

小牛马的产品经理要求做一个实时 CPU 监控曲线，每秒更新一次数据。我们用折线图 + 定时器轻松实现。

QLineSeries *series = new QLineSeries;series->setName("CPU占用率");QChart *chart = new QChart;chart->addSeries(series);chart->createDefaultAxes();chart->axisX()->setTitleText("时间(秒)");chart->axisY()->setTitleText("百分比");chart->axisY()->setRange(0, 100);QChartView *view = new QChartView(chart);setCentralWidget(view);int counter = 0;QTimer *timer = new QTimer;connect(timer, &QTimer::timeout, [=]() mutable {    int cpuUsage = QRandomGenerator::global()->bounded(20, 80);    series->append(counter++, cpuUsage);    // 只保留最近30个点，防止数据太多    if (series->count() > 30) {        series->remove(0);    }    chart->axisX()->setRange(counter - 30, counter);});timer->start(1000);

这样，一个实时滚动的 CPU 监控图就完成了，产品经理看了直呼专业。

⚠️ 常见坑点

忘记加 QT += charts：编译报错“找不到 QChartView”。
坐标轴没有附加：使用 createDefaultAxes 后，如果添加新的序列，需要手动 attachAxis。
饼图切片 hover 效果：需要设置 setHovered(true) 并连接信号。
中文乱码：确保源文件编码为 UTF-8，并在 main 函数中设置 QTextCodec::setCodecForLocale。

五、样式美化（iOS 风格）

// 设置主题和背景chart->setTheme(QChart::ChartThemeBlueCerulean);chart->setBackgroundBrush(QBrush(QColor(248,248,255)));chart->setAnimationOptions(QChart::SeriesAnimations);  // 开启动画

Qt Charts 内置了多种主题（Light、BlueCerulean、Dark等），一键切换，瞬间提升颜值。

总结

📱 今日要点回顾

Qt Charts 模块：专业图表库，支持柱状图、折线图、饼图等。
核心类：QChartView、QChart、QBarSeries、QLineSeries、QPieSeries。
动态更新：结合定时器可实现实时监控曲线。
工程配置：QT += charts 必加。

小牛马用 Qt Charts 半天就搞定了所有报表，老板看后大喜，当场给他加了鸡腿。你也来试试吧！

💬 今日话题：你用 Qt 做过哪些炫酷的数据可视化？或者你被老板催过哪些奇葩报表？评论区分享你的故事～

下一期预告：【QT精讲】QWebEngineView —— 在 Qt 里嵌入浏览器，做混合应用必备。记得关注，别走丢～评论区见，码了只羊在线陪聊。

🐑 码了只羊 · 野生白羊座程序员不混大厂，不写八股。专注用QT码点小玩意儿。