SuperMap iClient3D for WebGL平面场景实现绘制任意面进行GPU空间查询

文章目录


前言

写之前先说一下,以往咱们都是在球面场景中绘制一个规则的体对模型图层做GPU空间查询,可参考:https://www.supermapol.com/webgl/examples/webgl/editor.html#spatialQuery3D。最近遇到有些小伙伴问在平面场景中如何绘制任意面对模型进行GPU空间查询,其实核心就是如何把绘制出来的面拉成一个体并让接口能正确识别这个体,以下是实现方法。


一、加载模型缓存服务并获取需要操作的图层

javascript 复制代码
				//设置平面场景
				scene.mode = SuperMap3D.SceneMode.COLUMBUS_VIEW;
				//加载三维缓存服务
                var promise = scene.open("http://localhost:8090/iserver/services/3D-WorkSpace/rest/realspace");

				//获取需要进行操作的图层
				var layerSelect = [];
                var layer = scene.layers.find("Building_1");
                layer.selectedColor = SuperMap3D.Color.RED;
                layerSelect.push(layer);

二、绘制任意面

这里使用DrawHandler

javascript 复制代码
				//初始化handlerPolygon 
				var handlerPolygon = new SuperMap3D.DrawHandler(viewer, SuperMap3D.DrawMode.Polygon, 0);
				handlerPolygon.drawEvt.addEventListener(function (result) {
                        handlerPolygon.polygon.show = false;
                        handlerPolygon.polyline.show = false;
                     });
                     //激活handlerPolygon
                     handlerPolygon.activate();

三、拉伸体

1、获取步骤二所绘制面的节点

此次在步骤二的addEventListener监听里面获取

javascript 复制代码
						for (var pt of result.object.positions) {
                            var cartographic = SuperMap3D.Cartographic.fromCartesian(pt);
                            var longitude = SuperMap3D.Math.toDegrees(cartographic.longitude);
                            var latitude = SuperMap3D.Math.toDegrees(cartographic.latitude);
                            var height = cartographic.height;
                            var pnt = new SuperMap3D.Point3D(longitude, latitude, height);

                            point3ds.add(pnt);
                        }
                        point3dsArray.push(point3ds);

2、拉伸体

javascript 复制代码
						//初始化拉伸体
						var geometry = undefined;
                        geometry = new SuperMap3D.GeoRegion3D(point3dsArray);
                        geometry.extrudedHeight = 100; //拉伸高度
                        geometry.isLatLon = false; //设为false
                        geometry.bottomAltitude = 5; //底部高度

3、进行空间查询

javascript 复制代码
						// 空间查询
                        spatialQuery.geometry = geometry;
                        spatialQuery.positionMode = mode;
                        spatialQuery.layers = layerSelect;
                        spatialQuery.outlineColor = SuperMap3D.Color.CORNFLOWERBLUE;
                        spatialQuery.fillStyle = SuperMap3D.FillStyle.Fill_And_WireFrame;
                        spatialQuery.build();

四、运行效果


相关推荐
3D小将4 小时前
3D格式转换之Rhino转换为IGS格式技术
3d·stp模型·igs模型·glb模型
PhotonixBay14 小时前
InGaAs微透镜3D形貌怎么测?共聚焦显微镜在光通信的应用实践
功能测试·测试工具·3d·测试标准
学习星球18 小时前
AI 一句话生成 3D 游戏世界:腾讯 HY-World 2.0 开源深度解析与本地实战
开发语言·人工智能·游戏·3d·ai·课程设计·ai编程
李游Leo18 小时前
【共创稿事节】 HarmonyOS 7 空间化 UI 实战:从平面布局到空间层级的界面重构
ui·平面·harmonyos
意图共鸣18 小时前
意图共鸣科技《智能体接口化白皮书2.0》从三脚架到四面体——三角模型不是平面的,是立体的
科技·平面
算法大模型备案干货咪18 小时前
《敏感词库工程实现:从平面词表到分层拦截系统》
平面
ai小陈1 天前
Hunyuan3D-2云端部署实战:图生3D、文生3D怎么跑更稳
人工智能·科技·3d·ai·音视频·gpu算力
独立开发之道2 天前
Three.js 创建 VR 内容:四步把一个普通 3D 场景送进头显
javascript·3d·vr
k4m7v2pz2 天前
Bevy 0.18.1 雨雪天气粒子系统排障实录:四个“想当然“如何让 3D/2D 粒子全部不可见
3d·游戏开发·3d渲染·bevy·天气粒子·2d渲染
戴西软件2 天前
戴西iDWS.3DViz Suite数据轻量化可视化软件,从传统桌面软件向云端协同的重大突破
大数据·运维·网络·人工智能·机器学习·3d