Qt开发技术:Q3D图表开发笔记(一):Q3DScatter三维散点图介绍、Demo以及代码详解

本文涉及的产品
数据可视化DataV,5个大屏 1个月
可视分析地图(DataV-Atlas),3 个项目,100M 存储空间
简介: qt提供了q3d进行三维开发,虽然这个框架没有得到大量运用也不是那么成功,性能上也有很大的欠缺,但是普通的点到为止的应用展示还是可以的。

前言

  qt提供了q3d进行三维开发,虽然这个框架没有得到大量运用也不是那么成功,性能上也有很大的欠缺,但是普通的点到为止的应用展示还是可以的。

  其中就包括华丽绚烂的三维图表,数据量不大的时候是可以使用的。


Demo:Q3DScatter散点图演示效果

  

  

  


Q3D提供的三维图表

  依赖QtDataVisualization。在安装qt的时候要选择安装QtDataVisualization模块。

Q3DScatter散点图

  Q3D的散点图,性能大约支撑1000个点可以不卡顿,具体依赖pc,1000个点是什么 概念,可以理解为:10x10x10的区域,每个区域一个数据点。

  

Q3DBars柱状图

  Q3D的柱状图,性能跟散点图类似。

  

Q3DSurface平面凹凸图,平面纹理图

  Q3D的柱状图,性能跟散点图类似。

  


Q3DScatter散点图

简介

  Q3DScatter类提供了渲染3D散点图的方法。能够在3D中渲染散点图,并通过自由旋转场景来查看散点图。

  旋转是通过按住鼠标右键并移动鼠标来完成的。缩放由鼠标滚轮完成。如果启用,则通过鼠标左键进行选择。通过单击鼠标滚轮,可以将场景重置为默认摄影机视图。在触摸设备中,旋转是通过点击和移动完成的,选择是通过点击并按住并缩放。

  如果没有设置轴,将创建没有标签的临时默认轴。这些默认轴可以通过轴访问器进行修改,但是一旦为方向明确设置了任何轴,该方向的默认轴就会被破坏。

  Q3DScatter支持同时显示多个系列。

构造最小Q3DS散点图

  首先,构建Q3DS散射器。由于在本例中我们将图形作为顶级窗口运行,因此需要清除Qt::FramelessWindowHint标志,该标志默认设置为:

Q3DScatter scatter;
scatter.setFlags(scatter.flags() ^ Qt::FramelessWindowHint);

  现在Q3DScatter已准备好接收要渲染的数据。添加一系列3个QVector3D项目:

QScatter3DSeries *series = new QScatter3DSeries;
QScatterDataArray data;
data << QVector3D(0.5f, 0.5f, 0.5f) << QVector3D(-0.3f, -0.5f, -0.4f) << QVector3D(0.0f, -0.3f, 0.2f);
series->dataProxy()->addItems(data);
scatter.addSeries(series);

  最后,将其设置为可见:

scatter.show();

  创建和显示此图形所需的完整代码是:

#include <QtDataVisualization>
using namespace QtDataVisualization;
int main(int argc, char **argv)
{
    QGuiApplication app(argc, argv);
    Q3DScatter scatter;
    scatter.setFlags(scatter.flags() ^ Qt::FramelessWindowHint);
    QScatter3DSeries *series = new QScatter3DSeries;
    QScatterDataArray data;
data << QVector3D(0.5f, 0.5f, 0.5f) 
            << QVector3D(-0.3f, -0.5f, -0.4f)
            << QVector3D(0.0f, -0.3f, 0.2f);
    series->dataProxy()->addItems(data);
    scatter.addSeries(series);
    scatter.show();
    return app.exec();
}

  运行效果:

  

  场景可以被旋转、放大,并且可以选择一个项目来查看其位置,但在这个最小的代码示例中不包括其他交互。通过熟悉所提供的示例(如散点示例)来了解更多信息。


Q3Ddemo构建流程解析

步骤一:确认安装QtDataVisualization模块

  如何确认,则是在帮助文件中查看是否有Q3dscatter类。一般是安装了模块才会有对应的帮助文件。没有则重新安装qt或者单独安装该模块。

  

步骤二:工程配置文件中加入模块

  Q3d是在数据可视化模块中,需要在pro或者pri配置文件中添加。

QT += datavisualization

  

步骤三:添加使用到的头文件

  使用到Q3DScatter相关类中添加头文件,主要使用到Q3DScatter和QScatter3DSeries等等。

#include <Q3DScatter>
#include <Q3DTheme>
#include <QScatter3DSeries>
#include <QVector3D>

  

步骤四:添加命名空间

  这时候还是无法使用对应的类,需要添加命名空间才行,查看最后“入坑一”:

using namespace QtDataVisualization;

  

步骤五:Q3D的图标基础构建框架

  下面是包含注释的Q3DScatter基础构建流程,其他两种图类似:

_pQ3DScatter = new Q3DScatter();
_pContainer = QWidget::createWindowContainer(_pQ3DScatter, this);
// 设置轴文本
{
    _pQ3DScatter->axisX()->setTitle("X");
    _pQ3DScatter->axisY()->setTitle("Y");
    _pQ3DScatter->axisZ()->setTitle("Z");
}
// 设置轴范围
{
//        _pQ3DScatter->axisX()->setRange(0, 10);
//        _pQ3DScatter->axisY()->setRange(0, 10);
//        _pQ3DScatter->axisZ()->setRange(0, 10);
}
// 生成一个曲线
_pScatter3DSeries = new QScatter3DSeries(_pQ3DScatter);
// 设置渲染平滑
_pScatter3DSeries->setMeshSmooth(true);
// 视图添加该曲线
_pQ3DScatter->addSeries(_pScatter3DSeries);
// 设置阴影质量
_pQ3DScatter->setShadowQuality(QAbstract3DGraph::ShadowQualitySoftLow);
// 设置视角
_pQ3DScatter->scene()->activeCamera()->setCameraPreset(Q3DCamera::CameraPresetIsometricLeft);
// 设置子网格
_pQ3DScatter->activeTheme()->setGridEnabled(true);
#if 1
// 添加模拟数据
QScatterDataArray data;
data << QVector3D(1, 1,1) << QVector3D(1, 1, 2) << QVector3D(1, 1, 3)
     << QVector3D(1, 2,1) << QVector3D(1, 2, 2) << QVector3D(1, 2, 3)
     << QVector3D(1, 3,1) << QVector3D(1, 3, 2) << QVector3D(1, 3, 3);
// 添加数据(自动冲掉之前的数据)
_pScatter3DSeries->dataProxy()->addItems(data);
#endif
#if 1
// 模拟
QList<QVector3D> listVector3D;
#if 0
listVector3D <<  QVector3D(5, 1,1) << QVector3D(5, 1, 2) << QVector3D(5, 1, 3)
             << QVector3D(5, 2,1) << QVector3D(5, 2, 2) << QVector3D(5, 2, 3)
             << QVector3D(5, 3,1) << QVector3D(5, 3, 2) << QVector3D(5, 3, 3);
#else
listVector3D << QVector3D(1, 1,1) << QVector3D(1, 1, 2) << QVector3D(1, 1, 3)
             << QVector3D(1, 2,1) << QVector3D(1, 2, 2) << QVector3D(1, 2, 3)
             << QVector3D(1, 3,1) << QVector3D(1, 3, 2) << QVector3D(1, 3, 3);
#endif


Demo源码

Q3dScatterWidget.h

#ifndef Q3DSCATTERWIDGET_H
#define Q3DSCATTERWIDGET_H
#include <QWidget>
#include <Q3DScatter>
#include <Q3DTheme>
#include <QScatter3DSeries>
#include <QVector3D>
using namespace QtDataVisualization;
namespace Ui {
class Q3dScatterWidget;
}
class Q3dScatterWidget : public QWidget
{
    Q_OBJECT
public:
    explicit Q3dScatterWidget(QWidget *parent = 0);
    ~Q3dScatterWidget();
public:
    void setData(QList<QVector3D> listVector3D);
protected:
    void initControl();
protected:
    void resizeEvent(QResizeEvent *event);
private:
    Ui::Q3dScatterWidget *ui;
private:
    Q3DScatter *_pQ3DScatter;               // q3d散点视图
    QWidget *_pContainer;                   // q3d窗口容器
    QScatter3DSeries *_pScatter3DSeries;    // q3d散点图数据
};
#endif // Q3DSCATTERWIDGET_H

Q3dScatterWidget.cpp

#include "Q3dScatterWidget.h"
#include "ui_Q3dScatterWidget.h"
#include <Q3DTheme>
#include <QDebug>
#include <QDateTime>
//#define LOG qDebug()<<__FILE__<<__LINE__
//#define LOG qDebug()<<__FILE__<<__LINE__<<__FUNCTION__
//#define LOG qDebug()<<__FILE__<<__LINE__<<QThread()::currentThread()
//#define LOG qDebug()<<__FILE__<<__LINE__<<QDateTime::currentDateTime().toString("yyyy-MM-dd")
#define LOG qDebug()<<__FILE__<<__LINE__<<QDateTime::currentDateTime().toString("yyyy-MM-dd hh:mm:ss:zzz")
Q3dScatterWidget::Q3dScatterWidget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::Q3dScatterWidget),
    _pQ3DScatter(0),
    _pContainer(0),
    _pScatter3DSeries(0)
{
    ui->setupUi(this);
    QString version = "v1.0.0";
    setWindowTitle(QString("q3d散点图示例 %1(作者:长沙红胖子 QQ:21497936 WX:15173255813 www.hpzwl.com").arg(version));
    initControl();
}
Q3dScatterWidget::~Q3dScatterWidget()
{
    delete ui;
}
void Q3dScatterWidget::setData(QList<QVector3D> listVector3D)
{
    double xMin, xMax, yMin, yMax, zMin, zMax;
    QScatterDataArray data;
    for(int index = 0; index < listVector3D.size(); index++)
    {
        // 添加模拟数据
        data << listVector3D.at(index);
        // 计算范围
        if(index == 0)
        {
            xMin = listVector3D.at(index).x();
            xMax = listVector3D.at(index).x();
            yMin = listVector3D.at(index).y();
            yMax = listVector3D.at(index).y();
            zMin = listVector3D.at(index).z();
            zMax = listVector3D.at(index).z();
        }else {
            if(xMin > listVector3D.at(index).x() + 1e-8)
            {
                xMin = listVector3D.at(index).x();
            }
            if(xMax < listVector3D.at(index).x() - 1e-8)
            {
                xMax = listVector3D.at(index).x();
            }
            if(yMin > listVector3D.at(index).y() + 1e-8)
            {
                yMin = listVector3D.at(index).y();
            }
            if(yMax < listVector3D.at(index).y() - 1e-8)
            {
                yMax = listVector3D.at(index).y();
            }
            if(zMin > listVector3D.at(index).z() + 1e-8)
            {
                zMin = listVector3D.at(index).z();
            }
            if(zMax < listVector3D.at(index).z() - 1e-8)
            {
                zMax = listVector3D.at(index).z();
            }
        }
    }
    // 添加数据(自动冲掉之前的数据)
    _pScatter3DSeries->dataProxy()->addItems(data);
    // 计算范围 x轴范围要大于等于y轴
    if(xMax - xMin < yMax - yMin)
    {
        xMax = xMin + (yMax - yMin);
    }
    _pQ3DScatter->axisX()->setRange(xMin, xMax);
    _pQ3DScatter->axisY()->setRange(yMin, yMax);
    _pQ3DScatter->axisZ()->setRange(zMin, zMax);
}
void Q3dScatterWidget::initControl()
{
    _pQ3DScatter = new Q3DScatter();
    _pContainer = QWidget::createWindowContainer(_pQ3DScatter, this);
    // 设置轴文本
    {
        _pQ3DScatter->axisX()->setTitle("X");
        _pQ3DScatter->axisY()->setTitle("Y");
        _pQ3DScatter->axisZ()->setTitle("Z");
    }
    // 设置轴范围
    {
//        _pQ3DScatter->axisX()->setRange(0, 10);
//        _pQ3DScatter->axisY()->setRange(0, 10);
//        _pQ3DScatter->axisZ()->setRange(0, 10);
    }
    // 生成一个曲线
    _pScatter3DSeries = new QScatter3DSeries(_pQ3DScatter);
    // 设置渲染平滑
    _pScatter3DSeries->setMeshSmooth(true);
    // 视图添加该曲线
    _pQ3DScatter->addSeries(_pScatter3DSeries);
    // 设置阴影质量
    _pQ3DScatter->setShadowQuality(QAbstract3DGraph::ShadowQualitySoftLow);
    // 设置视角
    _pQ3DScatter->scene()->activeCamera()->setCameraPreset(Q3DCamera::CameraPresetIsometricLeft);
    // 设置子网格
    _pQ3DScatter->activeTheme()->setGridEnabled(true);
#if 1
    // 添加模拟数据
    QScatterDataArray data;
    data << QVector3D(1, 1,1) << QVector3D(1, 1, 2) << QVector3D(1, 1, 3)
         << QVector3D(1, 2,1) << QVector3D(1, 2, 2) << QVector3D(1, 2, 3)
         << QVector3D(1, 3,1) << QVector3D(1, 3, 2) << QVector3D(1, 3, 3);
    // 添加数据(自动冲掉之前的数据)
    _pScatter3DSeries->dataProxy()->addItems(data);
#endif
#if 1
    // 模拟
    QList<QVector3D> listVector3D;
#if 0
    listVector3D <<  QVector3D(5, 1,1) << QVector3D(5, 1, 2) << QVector3D(5, 1, 3)
                 << QVector3D(5, 2,1) << QVector3D(5, 2, 2) << QVector3D(5, 2, 3)
                 << QVector3D(5, 3,1) << QVector3D(5, 3, 2) << QVector3D(5, 3, 3);
#else
    listVector3D << QVector3D(1, 1,1) << QVector3D(1, 1, 2) << QVector3D(1, 1, 3)
                 << QVector3D(1, 2,1) << QVector3D(1, 2, 2) << QVector3D(1, 2, 3)
                 << QVector3D(1, 3,1) << QVector3D(1, 3, 2) << QVector3D(1, 3, 3);
#endif
    // 添加数据
    setData(listVector3D);
#endif
}
void Q3dScatterWidget::resizeEvent(QResizeEvent *event)
{
    if(_pContainer)
    {
        _pContainer->setGeometry(rect());
    }
}


工程模板

  


入坑

入坑一:找不到Q3DScatter类

问题

  

原因

  有命名空间。

解决

using namespace QtDataVisualization;
相关实践学习
DataV Board用户界面概览
本实验带领用户熟悉DataV Board这款可视化产品的用户界面
阿里云实时数仓实战 - 项目介绍及架构设计
课程简介 1)学习搭建一个数据仓库的过程,理解数据在整个数仓架构的从采集、存储、计算、输出、展示的整个业务流程。 2)整个数仓体系完全搭建在阿里云架构上,理解并学会运用各个服务组件,了解各个组件之间如何配合联动。 3&nbsp;)前置知识要求 &nbsp; 课程大纲 第一章&nbsp;了解数据仓库概念 初步了解数据仓库是干什么的 第二章&nbsp;按照企业开发的标准去搭建一个数据仓库 数据仓库的需求是什么 架构 怎么选型怎么购买服务器 第三章&nbsp;数据生成模块 用户形成数据的一个准备 按照企业的标准,准备了十一张用户行为表 方便使用 第四章&nbsp;采集模块的搭建 购买阿里云服务器 安装 JDK 安装 Flume 第五章&nbsp;用户行为数据仓库 严格按照企业的标准开发 第六章&nbsp;搭建业务数仓理论基础和对表的分类同步 第七章&nbsp;业务数仓的搭建&nbsp; 业务行为数仓效果图&nbsp;&nbsp;
相关文章
|
2月前
|
开发工具 C++
qt开发技巧与三个问题点
本文介绍了三个Qt开发中的常见问题及其解决方法,并提供了一些实用的开发技巧。
|
2月前
自己动手写QT多线程demo
本文是作者关于如何编写Qt多线程demo的教程,介绍了如何实现多线程功能,包括可暂停和继续的功能。文章提供了部分示例代码,展示了如何创建线程类、启动和管理线程,以及线程间的通信。同时,还提供了相关参考资料和免费下载链接。
|
2月前
|
3月前
|
C++
C++ Qt开发:QUdpSocket网络通信组件
QUdpSocket是Qt网络编程中一个非常有用的组件,它提供了在UDP协议下进行数据发送和接收的能力。通过简单的方法和信号,可以轻松实现基于UDP的网络通信。不过,需要注意的是,UDP协议本身不保证数据的可靠传输,因此在使用QUdpSocket时,可能需要在应用层实现一些机制来保证数据的完整性和顺序,或者选择在适用的场景下使用UDP协议。
127 2
|
4月前
|
数据安全/隐私保护 C++ 计算机视觉
Qt(C++)开发一款图片防盗用水印制作小工具
文本水印是一种常用的防盗用手段,可以将文本信息嵌入到图片、视频等文件中,用于识别和证明文件的版权归属。在数字化和网络化的时代,大量的原创作品容易被不法分子盗用或侵犯版权,因此加入文本水印成为了保护原创作品和维护知识产权的必要手段。 通常情况下,文本水印可以包含版权声明、制作者姓名、日期、网址等信息,以帮助识别文件的来源和版权归属。同时,为了增强防盗用效果,文本水印通常会采用字体、颜色、角度等多种组合方式,使得水印难以被删除或篡改,有效地降低了盗用意愿和风险。 开发人员可以使用图像处理技术和编程语言实现文本水印的功能,例如使用Qt的QPainter类进行文本绘制操作,将文本信息嵌入到图片中,
172 1
Qt(C++)开发一款图片防盗用水印制作小工具
|
3月前
|
监控 C++ 容器
【qt】MDI多文档界面开发
【qt】MDI多文档界面开发
71 0
Qt开发网络嗅探器02
Qt开发网络嗅探器02
|
3月前
|
存储 运维 监控
Qt开发网络嗅探器01
Qt开发网络嗅探器01
|
3月前
|
网络协议 容器
Qt开发网络嗅探器03
Qt开发网络嗅探器03
|
3月前
【qt】多窗口开发
【qt】多窗口开发
53 0