首页 > 其他分享 >SuperMap-WebGL-S3MTilesLayer(图元操作)

SuperMap-WebGL-S3MTilesLayer(图元操作)

时间:2023-11-09 14:26:01浏览次数:34  
标签:function SuperMap layer WebGL selectedId 设置 S3MTilesLayer 图元 id

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()
    // 获取选中图元的id
    let selectid=selectlayer.getSelection()[0]
}, Cesium.ScreenSpaceEventType.LEFT_CLICK)

一、图元操作之颜色

1、临时选中高亮:即鼠标选中其他对象或者不选中时,不再高亮;

这种情况可直接设置图层的selectedColor

layer.selectedColor = Cesium.Color.RED

2、设置图元颜色

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

let selectedId = [15051, 15052]
let Colors= ['#152664','#0d2680']
// 设置图元颜色
function setColor(){
    for (let i = 0; i < selectedId.length; i++) {
        layer.setObjsColor([selectedId[i]], Cesium.Color.fromCssColorString(Colors[i]))
    }
}
// 删除相应id的图元颜色
function removeColor(){
    layer.removeObjsColor(selectedId.slice(0,5))
}
// 删除所有图元的颜色
function removeAllColor(){
    layer.removeAllObjsColor()
}

二、图元操作之可见性

可见性的操作主要分为不互斥、互斥两种

1、不互斥,即设置图元自身的可见性,不影响其他图元:

使用setOnlyObjsVisible(ids, isVisible)

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

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

使用setObjsVisible(ids, isVisible)

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

三、图元操作之偏移

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

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

标签:function,SuperMap,layer,WebGL,selectedId,设置,S3MTilesLayer,图元,id
From: https://www.cnblogs.com/HanJie0824/p/17819621.html

相关文章

  • 基于WebGL+HTML5的智慧粮仓3D可视化系统
    仓廪实、天下安。民之所需,行之所至。建设背景古往今来,粮食问题历来是安邦定国的头等大事。“粮食”作为人类生活的生命之源,在人们的日常生活中起着决定性的作用。收获的粮食归仓,仓储工作是稳定“大国粮仓”的重要环节,当粮食收购后,如何让丰收成果颗粒归仓,减少损失,并确保粮食储藏质量......
  • WebGL编程指南pdf电子版
    WebGL编程指南pdf电子版作者:【美】KouichiMatsuda,RodgerLea(松田浩一,罗杰•李)出版年:2014-6ISBN:9787121229428连接提取码:m9lw对WebGL基础介绍详细,翻译的很好。着色器,点线三角形绘制,变换矩阵,MVP矩阵,光照和层次模型。入门WebGL很好的参考,读完可以轻松实现一个机器人行......
  • [WebGL] sampler2DArray demo 多纹理渲染
    背景之前尝试过利用多个纹理单元,再基于传入给shader的vertexBuffer信息决定选1号纹理单元还是2号纹理单元。虽然理论上,这个方式确实行得通,但是一次drawcall绘制多个纹理,本来目的是为了提高绘制性能,而实际上却无法提高性能,甚至还有反作用。因为有说法是shader分支会......
  • Webgl 基础以及canvasKit学习
    一基础概念1.关于canvas、webgl、skia、canvasKitctx.getContext('2d'/'webgl'/'webgl2');类型2d、webgl、webgl2有什么不同?canvas2d主要的性能问题就在于,绘制中间对象没法缓存,以及部分能力需要CPU计算这两点上。而canvaskit在提供了类似canvas2d的......
  • 如何基于three.js(webgl)引擎架构,研发一套通过配置就能自动生成的3D机房系统
    序:这几年观察下来,大部分做物联网三维可视化解决方案的企业或个人,基本都绕不开3D机房。包括前面也讲过这样的案例《使用webgl(three.js)创建自动化抽象化3D机房,3D机房模块详细介绍(抽象版一)》 《 使用webgl(three.js)创建科技版3D机房,3D机房微模块详细介绍(升级版三)——......
  • webgl centroid质心插值的一点理解
    质心插值说的是什么2023.10.04再次review这个细节点:https://www.opengl.org/pipeline/article/vol003_6/https://github.com/WebGLSamples/WebGL2Samples/blob/master/samples/glsl_centroid.html#L69基本上把这个问题看明白了;centroid代表质心插值;问题来自于在对普通的vary......
  • @supermap/iclient-leaflet使用tiledMapLayer报错
    使用leaflet加载超图的时候有时候超图无法加载有时候报如下错误因为手上有好几个项目都在使用leaflet但是同样都使用@supermap/iclient-leaflet(版本11.1.0-a)加载超图,有的项目可行,有的不可行最后打开项目根目录下node_modules里查看@supermap文件夹里的iclient-leafl......
  • 解密Prompt系列14. LLM Agent之搜索应用设计:WebGPT & WebGLM & WebCPM
    前两章,我们分别介绍了基于微调和prompt的工具调用方案,核心都是如何让大模型和工具进行交互,包括生成工具调用语句和处理工具调用请求。不过在实际应用中,想要设计一个可以落地的LLMAgent,需要更全面整体的系统设计。本章我们以搜索工具为例,介绍如何更好和搜索引擎进行交互的LLMAgen......
  • 如何在浏览器中启用 WebGL 以使用 HTML5 3D 查看器
    描述WebCenter中的HTML53DColladaViewer(自14.1以来新增)要求在浏览器中启用WebGL。较旧的浏览器可能不支持此功能,或者要求用户首先显式启用此功能。本页介绍如何为所有主要浏览器启用此功能。WebGL3D查看器本文是以下超级用户文章的摘要:如何在浏览器中启用WebGL?程序......
  • 交通网络分析性能再升级,SuperMap iServer新增开启SSC分析模型
    导语SSC分析模型,全名SuperMapShortCut,底层采用ContractionHierarchies(简称CH)算法,该算法旨在通过对图形进行预处理和优化来降低最佳路径分析的时间复杂度。SuperMapiServer11i(2023)(以下简称iServer)对交通网络分析服务的最佳路径分析,支持开启SSC分析模型,可大幅提升分析性能......