当前位置：首页 > news >正文

Cesium 实例化潜入潜出

news 来源：原创 2025/5/25 10:19:29

Cesium 实例化潜入潜出

1、WebGL Instance 的原理

狭义的的WebGL 中说使用 Instance, 一般指使用 glDrawArraysInstanced 用于实例化渲染的函数。它允许在一次绘制调用中渲染多个相同的几何体实例，而无需为每个实例发起单独的绘制调用。

Three.js 就是使用这种方式, 狭义的Cesium 实例化并不是这样使用, 后面细说。

使用 glDrawArraysInstanced 的基本步骤:

创建并绑定缓冲区

// 创建几何体数据缓冲区（顶点位置）
const geometryBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, geometryBuffer);
const geometryData = new Float32Array([// 顶点数据 (例如：位置数据)0.0, 0.5, 0.0,  // 顶点1-0.5, -0.5, 0.0,  // 顶点20.5, -0.5, 0.0,   // 顶点3
]);
gl.bufferData(gl.ARRAY_BUFFER, geometryData, gl.STATIC_DRAW);// 创建实例数据缓冲区（变换矩阵数据）
const instanceBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, instanceBuffer);
const instanceData = new Float32Array([// 变换数据 (每个实例的变换矩阵)1.0, 0.0, 0.0, 0.0,  // 实例1的变换矩阵0.0, 1.0, 0.0, 1.0,  // 实例2的变换矩阵-1.0, 0.0, 0.0, 0.0, // 实例3的变换矩阵
]);
gl.bufferData(gl.ARRAY_BUFFER, instanceData, gl.STATIC_DRAW);

绑定缓冲区

// 绑定几何体缓冲区
gl.bindBuffer(gl.ARRAY_BUFFER, geometryBuffer);
const positionLocation = gl.getAttribLocation(program, "a_position");
gl.vertexAttribPointer(positionLocation, 3, gl.FLOAT, false, 0, 0);
gl.enableVertexAttribArray(positionLocation);// 绑定实例缓冲区
gl.bindBuffer(gl.ARRAY_BUFFER, instanceBuffer);
const instanceLocation = gl.getAttribLocation(program, "a_instanceTransform");
gl.vertexAttribPointer(instanceLocation, 4, gl.FLOAT, false, 4 * 4, 0);
gl.vertexAttribDivisor(instanceLocation, 1);  // 每个实例使用不同的值
gl.enableVertexAttribArray(instanceLocation);

着色器

// 顶点着色器
attribute vec3 a_position;// 每个实例的变换数据
attribute vec4 a_instanceTransform;uniform mat4 u_projectionMatrix;
uniform mat4 u_viewMatrix;void main(void) {mat4 modelMatrix = mat4(a_instanceTransform.x, 0.0, 0.0, 0.0,0.0, a_instanceTransform.y, 0.0, 0.0,0.0, 0.0, a_instanceTransform.z, 0.0,0.0, 0.0, 0.0, 1.0);gl_Position = u_projectionMatrix * u_viewMatrix * modelMatrix * vec4(a_position, 1.0);
}// 片元着色器
void main(void) {gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);  // 渲染红色
}

绘制

// 假设我们已经设置好了所有缓冲区、着色器等
const instanceCount = 3;  // 实例数量
const vertexCount = 3;    // 顶点数量（单个几何体的顶点数）
gl.drawArraysInstanced(gl.TRIANGLES, 0, vertexCount, instanceCount);// 解绑相关资源
gl.bindBuffer(gl.ARRAY_BUFFER, null);

2、Cesium 实例化的原理

Cesium 的狭义实例化并不是使用 glDrawArraysInstanced 实现的, 比如下面的代码, 像这种"普通的几何体"。
但并不是没有使用 glDrawArraysInstanced 实现实例化, 比如广告牌, “特殊的几何体”。

// 创建5个立方体
let dimensions = new Cesium.Cartesian3(1.0, 1.0, 1.0);
let boxGeometry = Cesium.BoxGeometry.fromDimensions({vertexFormat: Cesium.PerInstanceColorAppearance.VERTEX_FORMAT,dimensions: dimensions,
});const instances = [];for (let i = 0; i < 5; ++i) {const offsetX = Math.random() * 0.05;const offsetY = Math.random() * 0.05;const boxModelMatrix = Cesium.Matrix4.multiplyByUniformScale(Cesium.Transforms.eastNorthUpToFixedFrame(Cesium.Cartesian3.fromDegrees(info.lon + offsetX, info.lat + offsetY),),500.0,new Cesium.Matrix4(),);instances.push(new Cesium.GeometryInstance({geometry: boxGeometry,modelMatrix: boxModelMatrix,attributes: {color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.fromRandom({ alpha: 1.0 }),),},}),);
}window.primitive = viewer.scene.primitives.add(new Cesium.Primitive({geometryInstances: instances,appearance: new Cesium.PerInstanceColorAppearance({translucent: false,closed: true,}),}),
);

创建流程概览:

Primitive.prototype.update() {loadAsynchronous()
}function loadAsynchronous() {// 根据参数创建对应的几何体, 对于上面的例子, 这里会重复执行5次, 即使参数相同promises.push(createGeometryTaskProcessors[i].scheduleTask);// 合并几何体combineGeometryTaskProcessor.scheduleTask();|| -- PrimitivePipeline.combineGeometry()|| -- geometryPipeline() {// 关键: 将所有顶点应用实例的模型矩阵transformToWorldCoordinates();}}

还有很多其他关键操作, 比如顶点索引的合并, 实例对应的自定义属性, 包围盒等。这里只关心顶点位置数据。

3、总结

Three.js 方式:
在这里插入图片描述

Cesium 方式:
在这里插入图片描述

cesium在提交给GPU之前已经将顶点应用了实例对应的模型矩阵。

Cesium 实例化潜入潜出

Cesium 实例化潜入潜出 1、WebGL Instance 的原理狭义的的WebGL 中说使用 Instance, 一般指使用 glDrawArraysInstanced 用于实例化渲染的函数。它允许在一次绘制调用中渲染多个相同的几何体实例，而无需为每个实例发起单独的绘制调用。 Three.js 就是使用这种方…...

编程日记 2025/5/25 10:19:29

设计模式——适配器模式

1. 定义适配器模式（Adapter Pattern）属于结构型设计模式，它的主要作用是将一个类的接口转换成客户期望的另一个接口，使得原本由于接口不兼容而不能一起工作的类可以协同工作。简单来说，就是充当了不同接口之间的 “转…...

编程日记 2025/5/25 10:24:42

Linux安装Docker

如何在虚拟机中安装linux操作系统，参考文章： VMware下Centos7安装步骤-CSDN博客使用Xshell链接到linux操作系统执行命令，安装docker的底层工具 sudo yum install -y yum-utils device-mapper-persistent-data lvm2 增加阿里云docker下载仓…...

编程日记 2025/5/25 21:02:48

CH430N 插上电脑无反应

电路图，此处我用的是3.3V供电，现象就是插上USB,电脑没有反应。搜索也搜索不到抄板请看自己是多少V供电后来看到也有类似的换了芯片后就好了。md新板子第一个芯片就是坏的，服了。...

编程日记 2025/4/6 20:47:34

Java实现贪吃蛇游戏

目录一、项目结构二、实现步骤 1. 创建 Snake 类 2. 创建 Food 类 3. 创建 GameBoard 类 4. 创建 SnakeGame 类三、总结贪吃蛇是一个经典的电子游戏，它的玩法非常简单，但又充满了挑战。玩家通过控制蛇的移动，吃到食物并不断成长&a…...

编程日记 2025/5/26 0:19:47

为SSH2协议服务器的用户设置密钥

目录私钥的创建1. 在服务器上直接生成2. 如果需要配置免密登录3. 查看生成的密钥导出私钥至SSH用户获取sudo权限新的一台服务器类型是SSH2：这表示服务器支持SSH（Secure Shell）协议的第二个版本。SSH是一个网络协议，用于加密方式…...

编程日记 2025/5/25 23:38:25

sql server 查询对象的修改时间

sql server 不能查询索引的最后修改时间，可以查询表，存储过程，函数，pk 的最后修改时间使用以下语句 select * from sys.all_objects ob order by ob.modify_date desc 但可以参考一下统计信息的最后修改时间，因为索…...

编程日记 2025/5/25 0:20:46

均值聚类算法

K-均值聚类算法是一种常用的无监督学习算法，用于将数据集划分成K个不同的簇。该算法的步骤如下： 1. 选择聚类的个数K。 2. 随机初始化K个聚类中心。 3. 对每个数据点计算其与聚类中心的距离，并将其划分到最近的聚类中心所代表的簇。 4. 对每…...

编程日记 2025/5/26 0:10:04

django中cookie与session的使用

一、cookie cookie由服务器生成 ，存储在浏览器中的键值对数据,具有不安全性，对应敏感数据应该加密储存在服务端每个域名的cookie相互独立浏览器访问域名为A的url地址，会把A域名下的cookie一起传递到服务器cookie可以设置过期时间 django中设…...

编程日记 2025/5/23 23:43:06

Python 协程：并发编程的轻量级利器

一、协程是什么？ 协程是一种比线程更加轻量级的存在。它可以在特定的点暂停执行，然后在后续某个时刻恢复执行，并且能够在暂停期间保存其执行状态。与传统的多线程模型不同，协程不需要操作系统进行线程上下文切换的开销&#xff0c…...

编程日记 2025/5/26 0:30:22

理解JVM

JVM简介 JVM 是 Java Virtual Machine 的简称，意为 Java 虚拟机虚拟机是指通过软件模拟的具有完整硬件功能的、运行在一个完全隔离的环境中的完整计算机系统常见的虚拟机： JVM 、 VMwave 、 Virtual Box JVM 和其他两个虚拟机的区别： 1…...

编程日记 2025/5/22 7:59:02

GhostRace: Exploiting and Mitigating Speculative Race Conditions-记录

文章目录论文背景Spectre-PHT（Transient Execution ）Concurrency BugsSRC/SCUAF和实验条件流程Creating an Unbounded UAF WindowCrafting Speculative Race ConditionsExploiting Speculative Race Conditions poc修复flush and reload 论文 https:/…...

编程日记 2025/5/25 23:21:12

【环境搭建】使用IDEA远程调试Dolphinscheduler

以Dolphinscheduler-3.1.8为例，先把容器起了： $ docker pull apache/dolphinscheduler-standalone-server:3.1.8 $ docker run -d -p 12345:12345 -p 25333:25333 -p 5005:5005 -d apache/dolphinscheduler-standalone-server:3.1.8下载Dolphinschedule…...

编程日记 2025/5/25 23:40:17

强基计划之编程：开启科研精英培养新路径

强基计划之编程：开启科研精英培养新路径一、强基计划概述 1. 出台背景在 2003 年，教育部开启高校自主招生改革，于探索综合评价学生、破除招生“唯分数论”等方面收获一定成效。相关调查研究显示，自主招生所录取的学生在入校后…...

编程日记 2025/5/25 23:09:15

奇怪问题| Chrome 访问csdn 创作中心的时候报错：服务超时,请稍后重试

Chrome 访问csdn 创作中心的时候报错： 服务超时,请稍后重试用无痕浏览器可以正常访问关闭代理无效清缓存和Cookies无效。考虑无痕浏览器模式下插件不生效，尝试把chrome 插件也禁用，发现有效，是该扩展程序的缘故...

编程日记 2025/5/25 1:04:58

Spring Boot 教程之三十六：实现身份验证

如何在 Spring Boot 中实现简单的身份验证？ 在本文中，我们将学习如何使用 Spring设置和配置基本身份验证。身份验证是任何类型的安全性中的主要步骤之一。Spring 提供依赖项，即Spring Security，可帮助在 API 上建立身份验证。有很…...

编程日记 2025/5/21 19:10:07

设计模式中单例模式中懒汉模式的问题

设计模式中单例模式中懒汉模式的问题今天在项目中遇到了要使用懒汉模式的问题。百度之后，发现还有很多细节是自己之前没有见过的。于是记录一下。下面是在AI助手中的说明。单例模式的懒汉模式（Lazy Singleton）是在需要时才创建实例&#…...

编程日记 2025/5/25 23:12:09

【唐叔学算法】第18天：解密选择排序的双重魅力-直接选择排序与堆排序的Java实现及性能剖析

引言在数据排序的世界里，选择排序是一类简单而直观的算法，它通过不断选取未排序部分中的最小（或最大）元素来逐步构建有序序列。今天，我们将深入探讨两种基于选择思想的排序方法——直接选择排序和堆排序，…...

编程日记 2025/5/25 23:10:36

力扣48.旋转图像

文章目录一、前言二、原地旋转一、前言力扣48.旋转图像这道题要求把给定矩阵旋转90度，并且不允许使用额外矩阵来完成旋转图像。于是这道题只能使用原地旋转的方法来解决二、原地旋转对于一个N3的矩阵来说，只需要两次循环就可以完成了将A1放到…...

编程日记 2025/5/25 23:49:03

jdk1.8新特性、jvm内存结构、垃圾回收

一、JDK 1.8 也被称为 Java 8，有许多重要的新特性： 1、Lambda 表达式: 它允许把函数作为一个方法的参数（函数作为值传递），可以用更紧凑的方式来表示匿名内部类了例如： new Thread(new Runnable() {Overr…...

编程日记 2025/5/25 23:27:55

MFC/C++学习系列之简单记录13

MFC/C学习系列之简单记录13 前言memsetList Control代码注意总结前言今天记录一下memset和List control 的使用吧！ memset memset通常在初始化变量或清空内存区域的时候使用，可以对变量设定特定的值。使用： 头文件： C&#…...

编程日记 2025/5/25 23:12:09

RabbitMQ中的Topic模式

在现代分布式系统中，消息队列（Message Queue）是实现异步通信、解耦系统组件的重要工具。RabbitMQ 是一个广泛使用的开源消息代理，支持多种消息传递模式，其中 Topic 模式是一种灵活且强大的模式，允许生产者…...

编程日记 2025/5/26 0:39:58

苹果手机怎么清理空间：拯救你的拥挤手机

在数字生活的海洋中，我们的苹果手机就像一艘小船，载满了照片、应用、视频和各种下载的“宝贝”。随着时间的推移，这艘小船开始变得拥挤，航行速度放缓，甚至有时候直接卡壳。苹果手机怎么清理空间？是时候学会…...

编程日记 2025/5/23 15:31:05

实习冲刺数据库练习-01 基础查询

原题链接：牛客网在线编程_SQL篇_非技术快速入门数据表示例： 根据数据表示例要求我们完成以下查询： （1）获取用户信息表中所有的数据，请你取出相应结果 （2）获取用户的设备id对应的…...

编程日记 2025/5/20 1:17:23

GAN网络详解及涨点大全总结（源码）

（需要源码请私信或评论） GAN原理 GAN的基本原理建立在生成模型和判别模型的博弈过程上。这种独特的机制使得GAN能够在复杂的分布上实现高效的无监督学习。在这个过程中，生成器G和判别器D相互竞争，最终达到一种平衡状态，在此状态下，G能够产生高质量的合成样本，而D则无…...

编程日记 2025/5/25 23:31:23

前端关于pptxgen.js个人使用介绍

官方文档链接:Quick Start Guide | PptxGenJS git地址：https://github.com/gitbrent/PptxGenJS/ 1. 安装命令 npm install pptxgenjs --save yarn add pptxgenjs 2. 示例demo import pptxgen from "pptxgenjs"; // 引入pptxgen // 1. Create a Presenta…...

编程日记 2025/5/22 13:30:23

Webrtc音频模块(四) 音频采集

音频的采集还是封装在AudioDeviceWindowsCore中，相关的Core Audio API接口是下面几个： IAudioClient* _ptrClientIn IAudioCaptureClient* _ptrCaptureClient rtc::scoped_refptr<IMediaObject> _dmo rtc::scoped_refptr<IMediaBuffer> _me…...

编程日记 2025/5/22 17:42:12

乘积小于K的子数组

要解决“乘积小于 k 的子数组”问题，可以使用滑动窗口技术。下面是详细的步骤和思路： 初始化变量： 定义两个指针 left 和 right，都初始化为 0，用于表示窗口的左右边界。一个 product 变量初始化为 1，用于存…...

编程日记 2025/5/21 10:53:46

vue的ElMessage的css样式不生效

我使用elementplus，是使用的用哪个单独引入的，然后表单校验时候警告的css不生效，就是这个效果反复看视频的引入也没发现问题，后来才知道需要这个引入 import { ElMessage } from "element-plus"; import element-pl…...

编程日记 2025/5/22 1:37:44

视频会议系统如何对接电话会议系统？

视频会议系统如何对接电话会议系统？ 作者：开源视频会议系统BigBlueButton&BBBEasy中国区团队，Github地址：https://github.com/lihaiya/bigbluebutton 视频会议系统与电话会议系统的对接，是现代企业通信整合的重要…...

编程日记 2025/5/26 0:23:35

亚马逊API接口深度解析：如何高效获取商品详情与评论数据

在当今数字化时代，电商平台的数据对于商家和开发者来说至关重要。亚马逊作为全球领先的电商平台，其API接口为开发者提供了丰富的商品信息和评论数据。本文将深入探讨如何使用亚马逊API接口获取商品详情和商品评论，同时提供简洁明了的使用方法…...

编程日记 2025/5/25 23:56:54

1222面经

1，Kafka 如何保障顺序消费? Kafka 保障顺序消费主要通过以下几个关键机制和配置来实现： 分区策略 Kafka 将主题划分为多个分区，每个分区内的消息是天然有序的，其按照消息发送到分区的先后顺序进行存储和追加。生产者在发送消息…...

编程日记 2025/5/23 10:24:04

271-基于XC7V690T的12路光纤PCIe接口卡

一、板卡概述基于XC7V690T的12路光纤PCI-E接口卡，用于实现多通道高速光纤数据接收和发送，板卡兼容PCIe 2.0和PCIe 3.0规范，利用PCI-E Switch PEX 8748实现FPGA芯片与计算机的通信，计算机与板卡接口处提供PCI-e 16速接口&#xff…...

编程日记 2025/5/21 4:12:48

完成第一个 Vue3.2 项目后，这是我的技术总结

第一次Composition API 在vue3.2中，正式支持了script setup的写法,这样可以大大简化组件的代码量，减少一些重复操作，我认为当你写vue3时，应该把这当作默认写法。在vue3.2之前，一般会这样写。 <script>export de…...

编程日记 2025/5/25 23:10:36

类的动态演绎：程序运行中的生命绽放

任务1.按照要求设计类(根据输出设计类) 设计类就是根据数据封装的要求，抽象出适合的类。有如下情况的测试程序和测试程序的输出结果，要求设计类Smile。 （一）第1种情况： （1）测试程序如下&#x…...

编程日记 2025/5/25 23:34:57

从代币角度介绍solana账户体系

1、solana 的账户概念介绍 Solana的账户体系是其区块链的核心组成部分，它允许数据和价值在链上存储和转移。以下是Solana账户体系的一些关键特点： • 账户模型： • 在Solana上，所有数据都存储在所谓的“账户”中，类似…...

编程日记 2025/5/25 23:26:09

Python pygame 主副屏编程时在副屏上全屏窗口的方法

Python在windows环境中编程时，用pygame工具包能够很轻易的完成2D游戏的简单设计，非常好用，相关帖子很多。而当电脑连接了多块显示器时（注意不是windows的多桌面），系统选择扩展这些显示器后，可…...

编程日记 2025/5/24 3:13:25

服务器数据恢复—V7000存储中多块磁盘出现故障导致业务中断的数据恢复案例

服务器存储数据恢复环境： 一台V7000存储上共12块SAS机械硬盘（其中1块是热备盘），组建了2组Mdisk，创建了一个pool。挂载在小型机上作为逻辑盘使用，小型机上安装的AIXSybase。服务器存储故障： V7…...

编程日记 2025/5/20 13:21:54

Qt开发经验 --- 避坑指南（2）

文章目录 1、 Heob窗口变得非常长，配置名称是一长串乱码2、 Qt安装报错 From 6.5.0, xcb-cursor0 or libxcb-cursor0 is needed to load the Qt xcb platform plugin.3、Cmake编译错误找不到libwinpthread-1.dll4、CMake编译找不到mingw5、linux下qtcreator启动报错…...

编程日记 2025/5/25 14:05:56

2.4 网络概念（分层、TCP）

网络层与传输层概述网络层： 抽象概念：网络层是基于 IP 的抽象概念，与数据链路层用 MAC 地址标记设备不同。MAC 地址是一种具体化的概念，绑定于所在的物理网络，而 IP 地址可以是固定的，也可以通过路由动态…...

编程日记 2025/5/24 10:33:26

Elasticsearch问题总结

Fielddata access on the_id field is disallowed, you can re-enable it by updating the dynamic cluster setting: indices.id_field_data.enabledElasticsearch默认禁用_id字段进行排序，这是因为_id字段通常不需要进行聚合或排序操作，启用字段数据可…...

编程日记 2025/5/24 8:52:58

C++点云大文件读取

C点云大文件读取 1. 常规读取1.1 逐行读取1.2 逐字节读取 2. 并行读取 (Multithreading)3. 使用缓冲读取 (Buffered I/O)4. 内存映射文件 (Memory Mapping) 在C中读取大文件时，如果需要提高读取速度，可以考虑以下几种方法： 1. 常规读取常规…...

编程日记 2025/5/22 3:54:15

Hololens 2 Unity VS2019编译报错解决方案

报错问题描述不够详细，但是针对Hololens 2和Unity开发环境中的VS2019编译错误，以下是一些常见的问题及其解决方案: 1.缺少或错误的Unity版本确保安装了支持Hololens 2的Unity版本(例如2019.3或更高)。 2.缺少C工作负载打开Visual Studio Installe…...

编程日记 2025/5/25 6:11:14

【Cadence射频仿真学习笔记】IC设计中电感的分析、建模与绘制（EMX电磁仿真，RFIC-GPT生成无源器件及与cadence的交互）

一、理论讲解 1. 电感设计的两个角度电感的设计可以从两个角度考虑，一个是外部特性，一个是内部特性。外部特性就是把电感视为一个黑盒子，带有两个端子，如果带有抽头的电感就有三个端子，需要去考虑其电感值、Q值和自…...

编程日记 2025/5/25 5:31:29

记录：virt-manager配置Ubuntu arm虚拟机

virt-manager（Virtual Machine Manager）是一个图形用户界面应用程序，通过libvirt管理虚拟机（即作为libvirt的图形前端） 因为要在Linux arm环境做测试，记录下virt-manager配置arm虚拟机的过程先在VMWare中…...

编程日记 2025/5/24 15:42:42

Qt Quick：CheckBox 复选框

复选框不止选中和未选中2种状态哦，它还有1种部分选中的状态。这3种状态都是Qt自带的，如果想让复选框有部分选中这个状态，需要将三态属性（tristate）设为true。未选中的状态值为0，部分选中是1，选…...

编程日记 2025/5/23 4:20:25

腾讯云云开发 Copilot 深度探索与实战分享

个人主页：♡喜欢做梦欢迎 👍点赞 ➕关注 ❤️收藏 💬评论目录一、引言二、产品介绍三、产品体验过程四、整体总结五、给开发者的复用建议六、对 AI 辅助开发的前景展望一、引言在当今数字化转型加速的时代，…...

编程日记 2025/5/21 1:53:03

Linux应用开发————mysql数据库表

mysql数据库表操作查看表的结构 mysql> desc / describe 表名; 或者： mysql> show create table 表名; 常见数据库引擎： innodb, myISAM... 删除表 mysql> drop tabl…...

编程日记 2025/5/23 19:17:52

《军工记忆》第二季播出，科技创新铸国之重器

2019年8月1日晚20点，《军工记忆》第二季在央视纪录频道（CCTV-9）播出，第一集《第一颗氢弹》首当其冲，为我们生动描绘了氢弹研制过程的艰难岁月，重现中国军工事业的漫漫长路，科技创新铸国之重器。…...

编程日记 2025/5/6 8:26:21

Cesium 实例化潜入潜出

1、WebGL Instance 的原理

2、Cesium 实例化的原理

3、总结

相关文章：