可视化开发：用Qt实现Excel级动态柱状图

news2025/4/25 12:20:05

Qt柱状图

QtChart

首先我们介绍一下 图表建立的基础：Qt Charts

QtChart 是Qt框架的一个模块，专注与提供交互式数据可视化功能

俗话就是 用于用户轻松创建各种类型的图表和图形界面

它包含的图表类型有很多：折线图，饼图，散点图，面积图等等，其中也包含我们这节重点要讲解的柱状图

知识点简介

QBarSet：用来存储柱状图中的一个数据集合。每个QBarSet代表一组柱子，每个柱子代表不同的颜色和标签

QBarSeries：同来管理多个QBarSet，将他们组成一个系列。负责处理柱子的布局和交互事件

QChart：图表的核心容器，负责管理所有的数据系列、坐标轴、图例、标题等。用来处理图表的整体样式，动画效果以及将数据渲染到视图

QChartView：用来显示QChart的视图组件，负责图表的可视化呈现

细节点

我们一般是将图标呈现在主控件，通过下面代码实现

this->setCentralWidget();  

那么我们该如何 将图表加入到子控件中呢？

通过布局的方式 先创建一个新控件（Widget），之后向其中加入一个垂直布局（在ui中实现）

然后我们使用布局函数

newLayout->addwidget(图表);

这里大家知道方法就可以了，具体操作，下面我有具体的项目实例

实现步骤

先实现柱状图中的一组数据

最终成果展示

1、输入框输入数据，然后呈现在柱状图中

2、柱状图的纵坐标范围自动根据，输入数据的大小来进行改变

3、表格最多存储6个数据，内部可以修改（改变宏的值），但是有一个专门的容器去存储数据，但是现在缺少一个展示数据的框，大家可以用list widget来实现，这个操作较为简单，大家自行操作

4、加入了动态图表效果，这里不好展示，大家可以自己写一遍运行即可

头文件

项目所需要包含的头文件

#include <QMainWindow>

#include <QVector>

#include <QtCharts/QBarSet>

#include <QtCharts/QBarSeries>

#include <QtCharts/QChart>

#include <QtCharts/QChartView>

#include <QPushButton>

#include <QtCharts/QBarCategoryAxis>

#include <QtCharts/QValueAxis>

QBarSet

.h文件中，创建变量

    QVector<int> dataEditEx1;

    QVector<int> dataEdit1;

    QVector<int> dataEditEx2;

QVector<int> dataEdit2;

    QBarSet *setData1;

    QBarSet *setData2;

dataEditEx 实现在图表中展现的数据，我们默认每组数据有

个柱子

dataEdit 用来每次输入的存储数据，让数据存储数量不在局限在6个

setData 柱状图的一组数据

补充

存储数据的方式：append()  或者 重载的<< 运算符

设置图标颜色 setColor()

我这里只提供 函数名 参数还有返回值大家自行利用 Qt Assistant查询即可，Qt内容较多，较杂，大部分东西都需要查，大家在学习工程中一定要学会查询！！

QBarSeries

用来管理多个 QBarSet 对象，定义 柱状图的显示方式

添加数据集（QBarSet）函数：append()

设置柱状宽度比例：setBarWidth()  参数范围0~1

QChart

图表的容器

添加数据集 addSeries()

设置标题 setTitle()

图表添加坐标轴

添加坐标轴的步骤

  1. 将坐标轴添加到图表（chart）中 addAxis
  2. 将坐标轴与数据集联系起来 attachAxis

QChartView

图表的展示

好了基础知识点大家都知道了，现在我给大家补充一些方法和小知识点

知识点与方法

1、补充一个遍历数组和容器的方式

for (元素类型 变量名 : 容器/数组) 

{

// 循环体：每次迭代中，变量名会依次指向容器中的一个元素

}

这是一种 范围循环，其作用是 遍历容器或数组中的每一个元素

我们可以用这种方法 遍历容器数据或者 求容器中的最大值

2、更新图表的方式

先关掉数据集，再打开数据集即可

    //更新表格

    dataChart->removeSeries(dataSeries);

    dataChart->addSeries(dataSeries);

项目实现

  1. 页面实现
ui页面

代码部分
.h文件
#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QVector>
#include <QtCharts/QBarSet>
#include <QtCharts/QBarSeries>
#include <QtCharts/QChart>
#include <QtCharts/QChartView>
#include <QPushButton>
#include <QtCharts/QBarCategoryAxis>
#include <QtCharts/QValueAxis>
#include <QDebug>
using namespace QtCharts;
#define NUM 6

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();
    void clearSet(QBarSet *setData);
public slots:
    void changeData();

private:
    Ui::MainWindow *ui;
    QVector<int> dataEditEx1;
    QVector<int> dataEdit1;
    QVector<int> dataEditEx2;
    QVector<int> dataEdit2;
    QStringList category;

    QBarSet *setData1;
    QBarSet *setData2;
    QBarSeries *dataSeries;
    QChart *dataChart;
    QChartView *dataView;
    QBarCategoryAxis *axisX;
    QValueAxis *axisY;
};

#endif // MAINWINDOW_H
知识点补充

再说mainwindow部分之前 我先说一下

坐标轴的添加步骤

分为x轴与y轴

x轴常作为 类别栏

y轴常作为 数值栏

类别栏的实现 有两个步骤

1、创建一个坐标轴

2、设置一个类别列表QStringList

    1. 为什么是列表呢，大家可以查一下 列表轴（QBarCategoryAxis）中的append 函数的参数要求

3、将列表添加到坐标轴中 append函数

数值栏的实现

  1. 创建一个数值轴
  2. 设置范围

数值栏和类别栏都需要的操作是把列表 把坐标轴添加到图表chart中，并于数据集series联系起来上面有讲

ui中按钮快捷键

mainwindow 函数部分
#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    //输入框1的呈现数据 默认6个0
    for(int i = 0;i < NUM;i++)
    {
        dataEditEx1.push_back(0);
    }

    //输入框2的呈现数据 默认6个0
    for(int i = 0;i < NUM;i++)
    {
        dataEditEx2.push_back(0);
    }

    //将数据输入数据表
    setData1 = new QBarSet("data1",this);
    for(QVector<int>::iterator it = dataEditEx1.begin();it != dataEditEx1.end();it++)
    {
        *setData1 << *it;
    }

    setData2 = new QBarSet("data2",this);
    for(QVector<int>::iterator it = dataEditEx2.begin();it != dataEditEx2.end();it++)
    {
        *setData2 << *it;
    }


    //设置颜色
    setData1->setColor(Qt::green);
    setData2->setColor(Qt::red);


    //将数据表打包
    dataSeries = new QBarSeries(this);
    dataSeries->append(setData1);
    dataSeries->append(setData2);


    //将数据包 生成图表

    dataChart = new QChart();
    dataChart->addSeries(dataSeries);
    dataChart->setTitle("数据呈现表格");


    //图表添加坐标轴
    QBarCategoryAxis *axisX = new QBarCategoryAxis();
    axisX->append(category);
    dataChart->addAxis(axisX,Qt::AlignBottom);
    dataSeries->attachAxis(axisX);

    QValueAxis *axisY = new QValueAxis;
    axisY->setRange(0,1);
    dataChart->addAxis(axisY,Qt::AlignLeft);
    dataSeries->attachAxis(axisY);


    //将图表呈现出来
    dataView =new QChartView(dataChart,this);
    dataView->setRenderHint(QPainter::Antialiasing); // 抗锯齿
    ui->myWidgetVLayout->addWidget(dataView);

    connect(ui->subBtn,&QPushButton::clicked,this,&MainWindow::changeData);
}
按键函数实现
//这个函数用来清空 数据表，我把它封装为了一个函数
void MainWindow::clearSet(QBarSet *setData)
{
    while(setData->count() > 0)
    {
        setData->remove(setData->count() - 1);
    }
}
void MainWindow::changeData()
{
    //清空数据表
    clearSet(setData1);
    clearSet(setData2);


    //处理显示容器
    dataEditEx1.remove(dataEditEx1.size() - 1);
    dataEditEx1.push_front(ui->data1Edit->text().toInt());
    dataEditEx2.remove(dataEditEx2.size() - 1);
    dataEditEx2.push_front(ui->data2Edit->text().toInt());


    //下面代码实现 坐标轴的值追随 展示数据的最大值
    //求出每个展示容器中的最大值
    int maxEx1 = 0,maxEx2 = 0;
    for(int &value : dataEditEx1)
    {
        maxEx1 = value < maxEx1 ? maxEx1 : value;
    }
    for(int &value : dataEditEx2)
    {
        maxEx2 = value < maxEx2 ? maxEx2 : value;
    }

    //重置数值坐标轴的范围
    axisY->setRange(0,(maxEx1 < maxEx2 ? maxEx2 : maxEx1));


    //数据输出到数据表
    for(QVector<int>::iterator it = dataEditEx1.begin();it != dataEditEx1.end();it++)
    {
        *setData1 << *it;
    }
    for(QVector<int>::iterator it = dataEditEx2.begin();it != dataEditEx2.end();it++)
    {
        *setData2 << *it;
    }


    //更新表格
    dataChart->removeSeries(dataSeries);
    dataChart->addSeries(dataSeries);


    //把数据同步到数据存储容器
    dataEdit1.push_back(ui->data1Edit->text().toInt());
    dataEdit2.push_back(ui->data2Edit->text().toInt());
}

结束

今天的分享到这里就结束了，如果你喜欢我的分享，请点赞收藏夹关注，谢谢大家

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/2326681.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

从零实现Json-Rpc框架】- 项目实现 - 基于Dispatcher模块的RPC框架

从零实现Json-Rpc框架】- 项目实现 - 基于Dispatcher模块的RPC框架

&#x1f4e2;博客主页&#xff1a;https://blog.csdn.net/2301_779549673 &#x1f4e2;博客仓库&#xff1a;https://gitee.com/JohnKingW/linux_test/tree/master/lesson &#x1f4e2;欢迎点赞 &#x1f44d; 收藏 ⭐留言 &#x1f4dd; 如有错误敬请指正&#xff01; &…
阅读更多...
kubekey -实现懒人一键部署K8S集群

kubekey -实现懒人一键部署K8S集群

kubekey -实现懒人一键部署K8S集群 操作步骤 官网&#xff1a; https://kubesphere.io/zh/ 一、执行以下命令快速创建一个 Kubernetes 集群。 Master节点 如果您访问 GitHub/Googleapis 受限&#xff0c;请登录 Linux 主机&#xff0c;执行以下命令设置下载区域。 [roottest ~]…
阅读更多...
李宏毅机器学习笔记（1）—机器学习基本概念+深度学习基本概念

李宏毅机器学习笔记（1）—机器学习基本概念+深度学习基本概念

机器学习基本概念 1、获取模型 步骤 1.1、假定未知函数 带未知参数的函数 1.2、定义损失函数 真实值&#xff1a;label MAE MSE 几率分布&#xff0c;cross-entropy? 1.3、优化 单独考虑一个参数 让损失函数最小&#xff0c;找导数为零的点 单独考虑w&#xff0c;w…
阅读更多...
数字IC后端项目常见问题之streamOut layermap和innovus drc violation

数字IC后端项目常见问题之streamOut layermap和innovus drc violation

Q1&#xff1a;我需要将Innovus设计GDS导出到Virtuoso&#xff0c;但发现写出GDS的过程会报如下所示的警告。这里写出GDS使用的是Virtuoso (DFII) streamOut mapping文件&#xff01; Clock Gen模块Routing DRC&#xff0c;Timing分析及解决 streamOut tease.gds2 -mapFile cd…
阅读更多...
短剧系统开发动漫短剧系统源码开发上线小程序app教程

短剧系统开发动漫短剧系统源码开发上线小程序app教程

一、市场规模与用户增长&#xff1a;突破677亿&#xff0c;Z世代成主力 整体扩张 2025年短剧市场预计同比增长15%&#xff0c;规模达677.9亿元&#xff0c;用户规模6.62亿&#xff08;占网民59.7%&#xff09;。动漫短剧作为细分领域&#xff0c;增速显著受益于二次元文化渗透&…
阅读更多...
太阳能高杆路灯：照亮未来的新光

太阳能高杆路灯：照亮未来的新光

在全球能源转型进程加速以及可持续发展理念日益深入人心的背景下&#xff0c;太阳能高杆路灯作为融合新能源技术、智能控制技术与多功能集成特性的创新产品&#xff0c;正逐步革新传统路灯的格局。其不仅有效解决了传统路灯对电网供电的依赖问题&#xff0c;更为城市及乡村的照…
阅读更多...
《C++Linux编程进阶：从0实现muduo 》-第8讲.C++面试如何高效获取线程ID

《C++Linux编程进阶：从0实现muduo 》-第8讲.C++面试如何高效获取线程ID

章节重点 在C面试时&#xff0c;经常被问到如果高效获取线程ID&#xff0c;但不少同学都不知道如何回答。 重点是通过__thread关键字。 重点内容 视频讲解&#xff1a;《CLinux编程进阶&#xff1a;从0实现muduo C网络框架系列》-第8讲. C面试如何高效获取线程ID 测试获取线…
阅读更多...
【Tauri2】011——菜单menu(2)

【Tauri2】011——菜单menu(2)

前言 前面简单地创建了菜单&#xff0c;接下来就来试试菜单中的action Rust中菜单项注册action AppHandle in tauri - Rusthttps://docs.rs/tauri/2.4.0/tauri/struct.AppHandle.html#method.on_menu_event这就需要用到App或者AppHandle中的方法on_menu_event #[must_use] …
阅读更多...
架构设计基础系列：面向对象设计的原则

架构设计基础系列：面向对象设计的原则

引言 面向对象设计&#xff08;Object-Oriented Design&#xff0c;OOD&#xff09;是软件开发中的重要概念&#xff0c;其核心在于通过对象、类、继承、封装和多态等机制&#xff0c;实现对现实世界问题的抽象和建模。OOD不仅有助于提高代码的可重用性、可维护性和可扩展性&a…
阅读更多...
UE5学习笔记 FPS游戏制作35 使用.csv配置文件

UE5学习笔记 FPS游戏制作35 使用.csv配置文件

文章目录 导入.csv要求首先创建一个结构体导入配置文件读取配置 导入 .csv要求 第一行必须包含标题 第一列的内容必须不能重复&#xff0c;因为第一列会被当成行的名字&#xff0c;在数据处理中发挥类似于字典的key的作用 当前的配置文件内容如下 首先创建一个结构体 结构…
阅读更多...
嵌入式单片机ADC数模转换的基本方法

嵌入式单片机ADC数模转换的基本方法

第一：模数转换的概述 1：模数转换的概念 一般在电路中，信号分为两种，一种是模拟信号，一种是数字信号，绝大多数传感器采集的都是模拟信号，如温度、湿度、烟雾浓度、亮度.......，但是对于计算机需要处理的数字信号，那就需要利用电路把模拟信号转换为数字信号，这个转换的…
阅读更多...
01-Docker 安装

01-Docker 安装

1、安装环境介绍 安装环境&#xff1a;Linux CentOS 7 本安装教程参考Docker官方文档&#xff0c;地址如下&#xff1a;https://docs.docker.com/engine/install/centos/ 2、卸载旧版docker 首先如果系统中已经存在旧的Docker&#xff0c;则先卸载&#xff1a; yum remove do…
阅读更多...
Redis 的缓存雪崩、击穿、穿透及其解决办法

Redis 的缓存雪崩、击穿、穿透及其解决办法

文章目录 Redis 的缓存雪崩、击穿、穿透及其解决办法缓存雪崩解决办法 缓存击穿解决方案 缓存穿透解决方案 Redis 的缓存雪崩、击穿、穿透及其解决办法 本篇文章回顾 Redis 当中缓存崩溃、击穿、穿透现象以及相应的解决办法&#xff0c;主要的参考资料是&#xff1a;https://w…
阅读更多...
性能比拼: Pingora vs Nginx (My NEW Favorite Proxy)

性能比拼: Pingora vs Nginx (My NEW Favorite Proxy)

本内容是对知名性能评测博主 Anton Putra Pingora vs Nginx Performance Benchmark: My NEW Favorite Proxy! 内容的翻译与整理, 有适当删减, 相关指标和结论以原作为准 介绍 在本视频中&#xff0c;我们将对比 Nginx 和 Pingora&#xff08;一个用于构建网络服务的 Rust 框架…
阅读更多...
Ranger一分钟

Ranger一分钟

简介 Ranger Admin&#xff1a;Web UIPolicy Admin Tool&#xff1a;定义和管理策略的模块Ranger Plugins&#xff1a;HDFS、Hive、HBase、Kafka、Storm、YARNRanger UserSync&#xff1a; LDAP、Active DirectoryRanger KMS&#xff1a;管理和保护数据加密的密钥 加密密钥管理…
阅读更多...
STM32单片机入门学习——第5节： [3-1]GPIO输出

STM32单片机入门学习——第5节： [3-1]GPIO输出

写这个文章是用来学习的,记录一下我的学习过程。希望我能一直坚持下去,我只是一个小白,只是想好好学习,我知道这会很难&#xff0c;但我还是想去做&#xff01; 本文写于&#xff1a;2025.04.01 STM32开发板学习——第5节&#xff1a; [3-1]GPIO输出 前言开发板说明引用解答和…
阅读更多...
pytorch中dataloader自定义数据集

pytorch中dataloader自定义数据集

前言 在深度学习中我们需要使用自己的数据集做训练&#xff0c;因此需要将自定义的数据和标签加载到pytorch里面的dataloader里&#xff0c;也就是自实现一个dataloader。 数据集处理 以花卉识别项目为例&#xff0c;我们分别做出图片的训练集和测试集&#xff0c;训练集的标…
阅读更多...
SQL Server：触发器

SQL Server：触发器

在 SQL Server Management Studio (SSMS) 中查看数据库触发器的方法如下&#xff1a; 方法一&#xff1a;通过对象资源管理器 连接到 SQL Server 打开 SSMS&#xff0c;连接到目标数据库所在的服务器。 定位到数据库 在左侧的 对象资源管理器 中&#xff0c;展开目标数据库&a…
阅读更多...
标题：利用 Rork 打造定制旅游计划应用程序：一步到位的指南

标题：利用 Rork 打造定制旅游计划应用程序：一步到位的指南

引言&#xff1a; 在数字化时代&#xff0c;旅游计划应用程序已经成为旅行者不可或缺的工具。但开发一个定制的旅游应用可能需要耗费大量时间与精力。好消息是&#xff0c;Rork 提供了一种快捷且智能的解决方案&#xff0c;让你能轻松实现创意。以下是使用 Rork 创建一个定制旅…
阅读更多...
WebSocket原理详解(二)

WebSocket原理详解(二)

WebSocket原理详解(一)-CSDN博客 目录 1.WebSocket协议的帧数据详解 1.1.帧结构 1.2.生成数据帧 2.WebSocket协议控制帧结构详解 2.1.关闭帧 2.2.ping帧 2.3.pong帧 3.WebSocket心跳机制 1.WebSocket协议的帧数据详解 1.1.帧结构 WebSocket客户端与服务器通信的最小单…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023