SuperMap iClient3D for WebGL教程(S3MTilesLayer)- 图元操作

2024-02-25 09:38

本文主要是介绍SuperMap iClient3D for WebGL教程(S3MTilesLayer)- 图元操作,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

作者:刘大

S3MTilesLayer,S3M(Spatial 3D Model)图层类,通过该图层实现加载三维切片缓存,包括倾斜摄影模型、BIM模型、点云数据、精细模型、矢量数据、符号等。
那S3MTilesLayer中针对图元的操作主要有‘颜色’,‘偏移’,‘可见性’’等,可通过下面这张表格,查看对应的方法,文章接下来就从这3个操作来进行说明

在这里插入图片描述

首先,图元的操作是基于图元对象的id进行指定的,我们一般可通过定义鼠标事件,去获取选中对象的id,或者通过数据查询获取需求的的图元对象的id

let screenSpaceEventHandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);screenSpaceEventHandler.setInputAction(function(e) {// 获取选中的S3M图层let selectlayer=viewer.scene.layers.getSelectedLayer()// 获取选中图元的idlet selectid=selectlayer.getSelection()[0]}, Cesium.ScreenSpaceEventType.LEFT_CLICK)

####图元操作之颜色
1.临时选中高亮:即鼠标选中其他对象或者不选中时,不再高亮;
这种情况可直接设置图层的selectedColor

s3mLayer.selectedColor = Cesium.Color.RED

若是经过查询获取的id,可以调用setSelection(id),设置该对象选中并高亮
2.设置图元颜色

    let selectedId = [15051, 15052, 17076, 17057, 17037, 17056, 17036, 15072, 14322, 17174, 16872, 16873]let Colors= ['#152664','#0d2680','#002eb3','#0041a2','#005ebc','#1b75cf','#0080ff', '#2baaf9','#55d7f8','#8cedff','#b1f1ff','#F0FFFF']// 设置图元颜色function setColor(){for (let i = 0; i < selectedId.length; i++) {s3mLayer.setObjsColor([selectedId[i]], Cesium.Color.fromCssColorString(Colors[i]))}}// 删除相应id的图元颜色function removeColor(){s3mLayer.removeObjsColor(selectedId.slice(0,5))}// 删除所有图元的颜色function removeAllColor(){s3mLayer.removeAllObjsColor()}

在这里插入图片描述

####图元操作之可见性
可见性的操作主要分为两种,
一.不互斥,即设置图元自身的可见性,不影响其他图元:
使用setOnlyObjsVisible(ids, isVisible)

   // 设置图元可见function setOnlyObjsVisible(){s3mLayer.setOnlyObjsVisible(selectedId,true)}// 设置图元不可见function setOnlyObjsDisVisible(){s3mLayer.setOnlyObjsVisible(selectedId,false)}

在这里插入图片描述

二.互斥,设置图元自身的可见性,会影响其他图元的可见性:

使用setObjsVisible(ids, isVisible)

  // 互斥:设置图元可见function setObjsVisible(){s3mLayer.setObjsVisible(selectedId,true)}// 互斥:设置图元不可见function setObjsDisVisible(){s3mLayer.setObjsVisible(selectedId,false)}

在这里插入图片描述

####图元操作之偏移
偏移和其他三种不太一样,设置的偏移参数是设置图层的selectedTranslate属性,而不是在set方法里面设定偏移参数

s3mLayer.selectedTranslate = new Cesium.Cartesian3(5, 0, 0)
s3mLayer.setObjsOffset([selectedId2])

在这里插入图片描述

这篇关于SuperMap iClient3D for WebGL教程(S3MTilesLayer)- 图元操作的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/745093

相关文章

Python调用Orator ORM进行数据库操作

《Python调用OratorORM进行数据库操作》OratorORM是一个功能丰富且灵活的PythonORM库,旨在简化数据库操作,它支持多种数据库并提供了简洁且直观的API,下面我们就... 目录Orator ORM 主要特点安装使用示例总结Orator ORM 是一个功能丰富且灵活的 python O

python使用fastapi实现多语言国际化的操作指南

《python使用fastapi实现多语言国际化的操作指南》本文介绍了使用Python和FastAPI实现多语言国际化的操作指南,包括多语言架构技术栈、翻译管理、前端本地化、语言切换机制以及常见陷阱和... 目录多语言国际化实现指南项目多语言架构技术栈目录结构翻译工作流1. 翻译数据存储2. 翻译生成脚本

0基础租个硬件玩deepseek,蓝耘元生代智算云|本地部署DeepSeek R1模型的操作流程

《0基础租个硬件玩deepseek,蓝耘元生代智算云|本地部署DeepSeekR1模型的操作流程》DeepSeekR1模型凭借其强大的自然语言处理能力,在未来具有广阔的应用前景,有望在多个领域发... 目录0基础租个硬件玩deepseek,蓝耘元生代智算云|本地部署DeepSeek R1模型,3步搞定一个应

Ubuntu固定虚拟机ip地址的方法教程

《Ubuntu固定虚拟机ip地址的方法教程》本文详细介绍了如何在Ubuntu虚拟机中固定IP地址,包括检查和编辑`/etc/apt/sources.list`文件、更新网络配置文件以及使用Networ... 1、由于虚拟机网络是桥接,所以ip地址会不停地变化,接下来我们就讲述ip如何固定 2、如果apt安

PyCharm 接入 DeepSeek最新完整教程

《PyCharm接入DeepSeek最新完整教程》文章介绍了DeepSeek-V3模型的性能提升以及如何在PyCharm中接入和使用DeepSeek进行代码开发,本文通过图文并茂的形式给大家介绍的... 目录DeepSeek-V3效果演示创建API Key在PyCharm中下载Continue插件配置Con

Deepseek R1模型本地化部署+API接口调用详细教程(释放AI生产力)

《DeepseekR1模型本地化部署+API接口调用详细教程(释放AI生产力)》本文介绍了本地部署DeepSeekR1模型和通过API调用将其集成到VSCode中的过程,作者详细步骤展示了如何下载和... 目录前言一、deepseek R1模型与chatGPT o1系列模型对比二、本地部署步骤1.安装oll

在不同系统间迁移Python程序的方法与教程

《在不同系统间迁移Python程序的方法与教程》本文介绍了几种将Windows上编写的Python程序迁移到Linux服务器上的方法,包括使用虚拟环境和依赖冻结、容器化技术(如Docker)、使用An... 目录使用虚拟环境和依赖冻结1. 创建虚拟环境2. 冻结依赖使用容器化技术(如 docker)1. 创

Spring Boot整合log4j2日志配置的详细教程

《SpringBoot整合log4j2日志配置的详细教程》:本文主要介绍SpringBoot项目中整合Log4j2日志框架的步骤和配置,包括常用日志框架的比较、配置参数介绍、Log4j2配置详解... 目录前言一、常用日志框架二、配置参数介绍1. 日志级别2. 输出形式3. 日志格式3.1 PatternL

轻松上手MYSQL之JSON函数实现高效数据查询与操作

《轻松上手MYSQL之JSON函数实现高效数据查询与操作》:本文主要介绍轻松上手MYSQL之JSON函数实现高效数据查询与操作的相关资料,MySQL提供了多个JSON函数,用于处理和查询JSON数... 目录一、jsON_EXTRACT 提取指定数据二、JSON_UNQUOTE 取消双引号三、JSON_KE

MySQL8.2.0安装教程分享

《MySQL8.2.0安装教程分享》这篇文章详细介绍了如何在Windows系统上安装MySQL数据库软件,包括下载、安装、配置和设置环境变量的步骤... 目录mysql的安装图文1.python访问网址2javascript.点击3.进入Downloads向下滑动4.选择Community Server5.