cesium 3dtile ClippingPlanes 多边形挖洞ClippingPlaneCollection
原理就是3dtiles里面的属性clippingPlanes
采用ClippingPlaneCollection,构成多边形来挖洞。
其次就是xyz法向量挖洞
clippingPlanes: new this.ffCesium.Cesium.ClippingPlaneCollection({unionClippingRegions: true, // true 表示多个切割面能合并为一个有效的切割区域planes: [new this.ffCesium.Cesium.ClippingPlane(new this.ffCesium.Cesium.Cartesian3(0.0, 0.0, -1.0), // 法向量23.0 // 切割平面到原点的距离(高度))]
})
以下是多边形裁剪
import * as Cesium from 'cesium'
class tileSetClipByPolygon {constructor(options) {this.tileSet = options.tileSet || null //3dtiles this.originPositions = options.originPositions || [] //点this.unionClippingRegions = !options.unionClippingRegions ? options.unionClippingRegions : truethis.enabled = !options.enabled ? options.enabled : truethis.edgeColor = options.edgeColor || Cesium.Color.WHITEthis.edgeWidth = options.edgeWidth || 0.0}isClockwise(polygon) {var area = 0var length = polygon.lengthfor (var i = 0; i < length; i++) {var j = (i + 1) % lengtharea += polygon[i][0] * polygon[j][1] - polygon[j][0] * polygon[i][1]}return area < 0}getInverseTransform() {let transformlet tmp = this.tileSet.root.transformif ((tmp && tmp.equals(Cesium.Matrix4.IDENTITY)) || !tmp) {// 如果root.transform不存在,则3DTiles的原点变成了boundingSphere.centertransform = Cesium.Transforms.eastNorthUpToFixedFrame(this.tileSet.boundingSphere.center)} else {transform = Cesium.Matrix4.fromArray(this.tileSet.root.transform)}return Cesium.Matrix4.inverseTransformation(transform, new Cesium.Matrix4())}clippingByPositions(clipping) {// debuggerconsole.log('this.tileSet', this.tileSet)this.tileSet.clippingPlanes = nullconst Cartesian3 = Cesium.Cartesian3const pointsLength = clipping.lengthconst clockwise = this.isClockwise(clipping)//所有的裁切面const clippingPlanes = []let positionsif (clockwise) {//如果为逆,则需要对数组取反positions = clipping.reverse()} else {positions = clipping}positions = clippingconst inverseTransform = this.getInverseTransform()for (let i = 0; i < pointsLength; ++i) {const nextIndex = (i + 1) % pointsLengthconst next = Cesium.Matrix4.multiplyByPoint(inverseTransform, Cesium.Cartesian3.fromDegrees(positions[nextIndex][0], positions[nextIndex][1]), new Cesium.Cartesian3())const now = Cesium.Matrix4.multiplyByPoint(inverseTransform, Cesium.Cartesian3.fromDegrees(positions[i][0], positions[i][1]), new Cesium.Cartesian3())// 定义一个垂直向上的向量uplet up = new Cesium.Cartesian3(0, 0, 10)//得到指向下一个点的向量let right = Cartesian3.subtract(next, now, new Cartesian3())right = Cartesian3.normalize(right, right)let normal = Cartesian3.cross(right, up, new Cartesian3())Cartesian3.normalize(normal, normal)//将法向量进行反向if (this.unionClippingRegions) {Cartesian3.negate(normal, normal)}//由于已经获得了法向量和过平面的一点,因此可以直接构造Plane,并进一步构造ClippingPlanelet planeTmp = Cesium.Plane.fromPointNormal(now, normal)const clipPlane = Cesium.ClippingPlane.fromPlane(planeTmp)clippingPlanes.push(clipPlane)}let the = thisconst clipPlanes = new Cesium.ClippingPlaneCollection({planes: clippingPlanes,edgeWidth: the.edgeColor,edgeColor: the.edgeColor,enabled: the.enabled,unionClippingRegions: the.unionClippingRegions})console.log('clipPlanes', clipPlanes)this.tileSet.clippingPlanes = clipPlanes}removeTilesetClip() {this.tileSet.clippingPlanes.enabled = false}
}
export default tileSetClipByPolygon
使用
this.CeiumPolygonClipA = new CeiumPolygonClip({tileSet: photographyTileset.value,originPositions: clipping,unionClippingRegions: false})this.CeiumPolygonClipA.clippingByPositions(clipping)
在 CesiumJS 中,ClippingPlane
和 ClippingPlaneCollection 通常用于控制哪些部分的场景或模型是可见的。通过切割面(ClippingPlanes),你可以裁剪或隐藏指定区域的内容。clippingPlanes
主要应用于以下几种对象:
1. 3D Tiles
3D Tiles 是一种用于存储和传输大规模 3D 场景的格式,它可以通过 clippingPlanes
进行裁剪。这是一个非常常见的应用,尤其是在城市建模和大规模场景可视化中。
clippingPlanes
可以直接应用于Cesium3DTileset
对象,以裁剪掉 3D Tiles 模型的一部分。
示例:
const tileset = viewer.scene.primitives.add(new Cesium.Cesium3DTileset({url: 'path/to/your/3dtiles/tileset.json',clippingPlanes: new Cesium.ClippingPlaneCollection({planes: [new Cesium.ClippingPlane(Cesium.Cartesian3.UNIT_Z, 100.0)]})
}));
在这个例子中,Cesium3DTileset
会被切割,只显示离 Z 轴 100 单位以内的区域。
2. Primitive(原始几何体)
clippingPlanes
也可以用于 Primitive 对象(如几何体、模型等),这是最基础的 3D 对象类型。通过将 ClippingPlaneCollection
赋值给 Primitive
,可以在渲染时裁剪它的几何体。
- 这种方法适用于自定义的几何体或其他静态几何体,例如:球体、立方体等。
示例:
const sphereGeometry = new Cesium.SphereGeometry({radius: 100.0
});const sphere = new Cesium.Primitive({geometryInstances: new Cesium.GeometryInstance({geometry: sphereGeometry,modelMatrix: Cesium.Matrix4.fromTranslation(new Cesium.Cartesian3(0.0, 0.0, 0.0)),}),appearance: new Cesium.MaterialAppearance({material: Cesium.Material.fromType('Color', {color: Cesium.Color.RED})}),clippingPlanes: new Cesium.ClippingPlaneCollection({planes: [new Cesium.ClippingPlane(Cesium.Cartesian3.UNIT_Z, 50.0) // 裁剪半径为 50 的球体]})
});viewer.scene.primitives.add(sphere);
在这个例子中,创建了一个球体并将其裁剪,裁剪面距离原点 50 单位,隐藏球体超过该高度的部分。
3. Models(3D 模型)
ClippingPlanes 也可以应用于 3D 模型(如 glTF 模型)。在 Cesium.Model
中,clippingPlanes
可以用来裁剪模型的一部分。
示例:
const model = viewer.scene.primitives.add(Cesium.Model.fromGltf({url: 'path/to/your/model.glb',clippingPlanes: new Cesium.ClippingPlaneCollection({planes: [new Cesium.ClippingPlane(Cesium.Cartesian3.UNIT_Z, 50.0)]})
}));
这段代码将对加载的 glTF 模型应用切割面,裁剪掉离 Z 轴 50 单位以上的部分。
4. Terrain(地形)
对于 Cesium 中的地形数据(例如使用 3D Tiles 数据源的地形),可以通过切割面进行裁剪。地形通常是通过 Cesium.CesiumTerrainProvider
加载的,而切割面可以用来限制地形的显示。
这种应用场景通常适用于大规模的地形可视化,用户可以通过切割面查看地形的特定部分,或从不同的切割角度进行分析。
5. Imagery(影像图层)
clippingPlanes
还可以用于影像图层,特别是当你想要切割或限制影像图层的显示时。通过使用 clippingPlanes
,你可以将某些区域的影像数据裁剪掉,以使其他数据更加突出。
示例:
const imageryLayer = viewer.imageryLayers.addImageryProvider(new Cesium.UrlTemplateImageryProvider({url : 'https://your-imagery-url/{z}/{x}/{y}.png'
}));imageryLayer.clippingPlanes = new Cesium.ClippingPlaneCollection({planes: [new Cesium.ClippingPlane(Cesium.Cartesian3.UNIT_Z, 100.0)]
});
在这个例子中,影像图层会被切割,只显示离 Z 轴 100 单位以内的部分。
其他可能的应用场景:
-
Skybox(天空盒)
clippingPlanes
也可用于裁剪 天空盒,这在某些需要动态裁剪天空内容的应用中有用。 -
Custom Primitives(自定义原始几何体) 如果你自己创建了自定义几何体,可以通过
clippingPlanes
使其进行裁剪,减少计算负担或者实现特定的可视化效果。 -
Ground Clipping (地面裁剪) 对于需要动态控制地面显示的场景,
clippingPlanes
可以用来裁剪地面,或者将其与其他场景元素进行交互。
总结
ClippingPlanes
在 Cesium 中是一个非常灵活的工具,可以应用于以下对象:
- 3D Tiles(如城市模型)
- Primitives(如几何体)
- Models(如 glTF 模型)
- Terrain(地形)
- Imagery(影像图层)
- Skybox(天空盒)
- Custom Primitives(自定义几何体)
这些对象可以通过 ClippingPlaneCollection
结合多个切割面来实现不同的裁剪效果,从而动态地控制场景中的可见部分。
相关文章:

cesium 3dtile ClippingPlanes 多边形挖洞ClippingPlaneCollection
原理就是3dtiles里面的属性clippingPlanes 采用ClippingPlaneCollection,构成多边形来挖洞。 其次就是xyz法向量挖洞 clippingPlanes: new this.ffCesium.Cesium.ClippingPlaneCollection({unionClippingRegions: true, // true 表示多个切割面能合并为一个有效的…...
docker 僵尸进程问题
docker僵尸进程 子进程结束后,父进程没有回收该进程资源(父进程可能没有wait),子进程残留资源存放与内核中,就变为僵尸进程(zombie) 场景分析:python脚本A中执行B应用,将A部署在docker中&#…...

微软要求 Windows Insider 用户试用备受争议的召回功能
拥有搭载 Qualcomm Snapdragon 处理器的 Copilot PC 的 Windows Insider 计划参与者现在可以试用 Recall,这是一项臭名昭著的快照拍摄 AI 功能,在今年早些时候推出时受到了很多批评。 Windows 营销高级总监 Melissa Grant 上周表示:“我们听…...

husky,commit规范,生成CHANGELOG.md,npm发版
项目git提交工程化(钩子,提交信息commit message),npm修改版本,需要涉及到的包: husky,允许在git钩子中执行不同的脚步,如commitlint,eslint,prettier&#…...
DETR:一种新颖的端到端目标检测与分割框架
DETR:一种新颖的端到端目标检测与分割框架 摘要: 随着深度学习技术的发展,目标检测和图像分割任务取得了显著的进步。然而,传统的基于区域提名的方法在处理这些问题时存在一定的局限性。为此,Facebook AI Research&am…...

前端js面试知识点思维导图(脑图)
如果看着不清晰可以去https://download.csdn.net/download/m0_73761441/90058523访问下载,无需积分 使用百度脑图制作,可以一键导入下面的文本生成自己的脑图 js相关面试题、知识点 数据类型 1. 数据类型分类?分别包含ÿ…...

【Java基础入门篇】一、变量、数据类型和运算符
Java基础入门篇 一、变量、数据类型和运算符 1.1 变量 计算机中的数据表示方式是:“二进制(0/1)”,但是同时也可以兼容其他进制,例如八进制、十进制、十六进制等。 Java变量的本质是:存储在固定空间的内容,变量名是…...
【llamafactory】安装与环境配置
拉取镜像 git clone --depth 1 https://github.com/hiyouga/LLaMA-Factory.git cd LLaMA-Factory创建虚拟环境 conda create -n llamafactory python3.10 conda activate llamafactory安装所需依赖 pip install -e ".[torch,vllm,optimum,auto_gptq]"...
Vue 3 + Vuex 埋点实现指南
在现代前端开发中,数据分析和用户行为追踪是不可或缺的部分。本文将介绍如何在 Vue 3 项目中实现埋点功能,具体使用 Vuex 进行状态管理,并通过自定义 Hook 实现埋点逻辑。 目录 项目结构实现埋点逻辑使用埋点功能总结 1.项目结构 我们将创…...

电子应用设计方案-30:智能扫地机器人系统方案设计
智能扫地机器人系统方案设计 一、引言 随着人们生活节奏的加快和对生活品质的追求,智能家居产品越来越受到消费者的青睐。智能扫地机器人作为一种能够自动清扫地面的智能设备,为人们节省了大量的时间和精力。本方案旨在设计一款功能强大、智能化程度高、…...

HTML飞舞的爱心(完整代码)
写在前面 HTML语言实现飞舞的爱心完整代码。 完整代码 <!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><title>飞舞爱心</title><style>* {margin: 0;padding: 0;}html,body {overflow: hidd…...
android shader gl_Position是几个分量
在Android的OpenGL ES中,gl_Position是顶点着色器(Vertex Shader)的一个内置输出变量,它用于指定顶点在裁剪空间(Clip Space)中的位置。gl_Position是一个四维向量(4-component vectorÿ…...

spine 动画层 动态权重
前奏.业务背景 这边想实现一个功能,项目中有 一只猫 猫的头会盯着逗猫棒移动。因为素材还没到所以这里使用了 spine 自带的猫头鹰。他的动画 刚好挺有针对性:(关联上篇)https://blog.csdn.net/nicepainkiller/article/details/144…...

《Python基础》之Python中可以转换成json数据类型的数据
目录 一、JSON简介 JSON有两种基本结构 1、对象(Object) 2、数组(Array) 二、将数据装换成json数据类型方法 三、在Python中,以下数据类型可以直接转换为JSON数据类型 1、字典(Dictionary)…...
在oracle下载jdk显示400 Bad Request Request Header Or Cookie Too Large
下载JDK17,官网地址:【https://www.oracle.com/cn/java/technologies/downloads/#jdk17-windows】 问题: 出现 400 Bad Request: Request Header Or Cookie Too Large 错误,通常是由于浏览器存储的 Cookies 或请求头过大所导致的…...
MongoDB注入攻击测试与防御技术深度解析
MongoDB注入攻击测试与防御技术深度解析 随着NoSQL数据库的兴起,MongoDB作为其中的佼佼者,因其灵活的数据模型和强大的查询能力,受到了众多开发者的青睐。然而,与任何技术一样,MongoDB也面临着安全威胁,其…...
【Java基础入门篇】前言
Java基础入门篇 本系列内容主要针对Java基础知识,总共包含四大部分内容: 变量、数据类型和运算符控制语句和递归算法面向对象和JVM底层分析数组和排序 学习需要具备: IDEA编译器 JDK1.8版本 写在前面 在Java入门的最开始,我们需…...
Oracle 建表的存储过程
建表的存储过程 下面是建表的存储过程,用途:通过不同的表,根据不同过滤条件,得到某个字段,例如neid,然后创建一个新表T,表T的表名为拼接XXXX_XXX_neid,表T的字段自行添加 xxx&…...

【Debug】hexo-github令牌认证 Support for password authentication was removed
title: 【Debug】hexo-github令牌认证 date: 2024-07-19 14:40:54 categories: bug解决日记 description: “Support for password authentication was removed on August 13, 2021.” cover: https://pic.imgdb.cn/item/669b38ebd9c307b7e9f3e5e0.jpg 第一章 第一篇博客记录一…...
torch.is_floating_point(input)
torch.is_floating_point(input) input: 输入张量 如果输入的数据类型是 浮点数据类型 ,则返回 True。否则返回False。 浮点数据类型:torch.float64、torch.float32、torch.float16 、 torch.bfloat16 import torch# 创建一个浮点数张量 float_tensor torch.te…...
零门槛NAS搭建:WinNAS如何让普通电脑秒变私有云?
一、核心优势:专为Windows用户设计的极简NAS WinNAS由深圳耘想存储科技开发,是一款收费低廉但功能全面的Windows NAS工具,主打“无学习成本部署” 。与其他NAS软件相比,其优势在于: 无需硬件改造:将任意W…...

智慧医疗能源事业线深度画像分析(上)
引言 医疗行业作为现代社会的关键基础设施,其能源消耗与环境影响正日益受到关注。随着全球"双碳"目标的推进和可持续发展理念的深入,智慧医疗能源事业线应运而生,致力于通过创新技术与管理方案,重构医疗领域的能源使用模式。这一事业线融合了能源管理、可持续发…...

51c自动驾驶~合集58
我自己的原文哦~ https://blog.51cto.com/whaosoft/13967107 #CCA-Attention 全局池化局部保留,CCA-Attention为LLM长文本建模带来突破性进展 琶洲实验室、华南理工大学联合推出关键上下文感知注意力机制(CCA-Attention),…...
在鸿蒙HarmonyOS 5中实现抖音风格的点赞功能
下面我将详细介绍如何使用HarmonyOS SDK在HarmonyOS 5中实现类似抖音的点赞功能,包括动画效果、数据同步和交互优化。 1. 基础点赞功能实现 1.1 创建数据模型 // VideoModel.ets export class VideoModel {id: string "";title: string ""…...

3.3.1_1 检错编码(奇偶校验码)
从这节课开始,我们会探讨数据链路层的差错控制功能,差错控制功能的主要目标是要发现并且解决一个帧内部的位错误,我们需要使用特殊的编码技术去发现帧内部的位错误,当我们发现位错误之后,通常来说有两种解决方案。第一…...
大语言模型如何处理长文本?常用文本分割技术详解
为什么需要文本分割? 引言:为什么需要文本分割?一、基础文本分割方法1. 按段落分割(Paragraph Splitting)2. 按句子分割(Sentence Splitting)二、高级文本分割策略3. 重叠分割(Sliding Window)4. 递归分割(Recursive Splitting)三、生产级工具推荐5. 使用LangChain的…...

PL0语法,分析器实现!
简介 PL/0 是一种简单的编程语言,通常用于教学编译原理。它的语法结构清晰,功能包括常量定义、变量声明、过程(子程序)定义以及基本的控制结构(如条件语句和循环语句)。 PL/0 语法规范 PL/0 是一种教学用的小型编程语言,由 Niklaus Wirth 设计,用于展示编译原理的核…...

ArcGIS Pro制作水平横向图例+多级标注
今天介绍下载ArcGIS Pro中如何设置水平横向图例。 之前我们介绍了ArcGIS的横向图例制作:ArcGIS横向、多列图例、顺序重排、符号居中、批量更改图例符号等等(ArcGIS出图图例8大技巧),那这次我们看看ArcGIS Pro如何更加快捷的操作。…...
【碎碎念】宝可梦 Mesh GO : 基于MESH网络的口袋妖怪 宝可梦GO游戏自组网系统
目录 游戏说明《宝可梦 Mesh GO》 —— 局域宝可梦探索Pokmon GO 类游戏核心理念应用场景Mesh 特性 宝可梦玩法融合设计游戏构想要素1. 地图探索(基于物理空间 广播范围)2. 野生宝可梦生成与广播3. 对战系统4. 道具与通信5. 延伸玩法 安全性设计 技术选…...

OPenCV CUDA模块图像处理-----对图像执行 均值漂移滤波(Mean Shift Filtering)函数meanShiftFiltering()
操作系统:ubuntu22.04 OpenCV版本:OpenCV4.9 IDE:Visual Studio Code 编程语言:C11 算法描述 在 GPU 上对图像执行 均值漂移滤波(Mean Shift Filtering),用于图像分割或平滑处理。 该函数将输入图像中的…...