3D高斯溅射（3DGS）技术带来了前所未有的逼真三维场景，但在实际三维场景开发中，我们却常常遇到这样的困境：
性能瓶颈：大场景加载缓慢，无法流畅运行？
融合难题：多源数据格式不一，难以无缝整合？
交互薄弱：空间定位不准、测量不便，业务逻辑难实现？
line-height:1.75em;" data-pm-slice="0 0 []">......
Mapmost SDK for WebGL 提供了完整的解决方案。文中附有即用代码，让您从数据到应用，一步到位，高效构建企业级数字孪生应用！
Mapmost
你要做一个城市级的三维项目，需要加载超大规模的3DGS数据，而市面上的开发引擎却只能处理小范围场景。
Mapmost SDK for WebGL可以轻松应对100平方公里的大场景！多分辨率表示与LOD（细节层次）技术能让大场景保持流畅的高精度渲染。
在二次开发中，开发者仅需简单几行代码，就能轻松实现数据加载功能。
//加载3DGS数据map.addLayer({id: 'gs-3d-layer',type: '3DGS',isLOD: true,//是否开启LODcoord: [121.68, 30.67, 0], //建模原点坐标url: 'http://ip:8080/3DGS/15-18_level_splat/', //Mapmost Studio发布的3DGS服务地址});
这段代码既支持单个3DGS模型加载也支持大场景下3DGS LOD服务的加载（Mapmost Studio提供一键服务发布能力）。
Mapmost
三维场景通常需要多种数据的组合。
Mapmost SDK 支持将3DGS 与三维模型、倾斜摄影、影像地图、矢量数据等无缝融合，构建真正“全要素”的数字孪生场景。
详细代码如下：
//加载3DGS数据map.addLayer({id: 'gs-3d-layer',type: '3DGS',isLOD: true,//是否开启LODcoord: [121.68, 30.67, 0], //建模原点坐标url: 'http://ip:8080/demos/3DGS/models/15-18_level_splat/', //3DGS服务地址});//加载倾斜数据map.addLayer({id: 'tile-3d-layer',type: '3DTiles',data: 'http://ip:8000/ALL_3DTiles/tileset.json', //3DTiles服务地址});//加载3D模型数据map.addLayer({id: 'model_id',type: 'model',models: [{type: 'glb',url: "http://ip:8000/models/car.glb"}],center: [120.78493768705789, 31.413810498185043],callback: function (group, layer) {//添加地理围栏三维特效modellayer.addGeoFencing({type: "fade",color: "#ffb520",speed: 0.01,opacity: 0.8,height: 20.6,data: {coordinate: [[120.7312621924155, 31.306584013529033,], [120.73127297245611, 31.306360383210475], *** ,[120.7321516898217, 31.3065900469539]],}});//添加特效圆modellayer.addCircle({type: "radar",color: "#31ffff",radius: 10,isCW: true,opacity: 0.8,center: [120.73230705870971, 31.306262219878096, 5.978198955640408]});//添加POIlet bt_div = document.createElement('div');bt_div.className = 'poi-layer div_bt';//POI标签样式bt_div.innerHTML = '斜塘老街-二期';modellayer.addMarker({id: 'poi',data: [{element: bt_div,position: [120.7317214588758, 31.306576289698263, 17.885578184139823],}]});},});
Mapmost构建的场景实现了不同数据的位置匹配，不用担心数据打架、渲染错乱的问题，让你的场景更真实、更有层次。
Mapmost
在三维场景中，你可以轻松获取任意点的精确位置，并快速添加信息点（POI）。无论是旅游导览、设施管理，还是地块标注，都能轻松实现。
Step1：在二次开发中，通过监听鼠标点击事件，开发者能快速获取 3DGS 数据中用户点击位置的三维坐标：
map.on('click', (e) => {const coor = e.coord;console.log(e.coord);//输出[经度,维度,高度]数组});
Step2：获取坐标后，便能关联并展示该位置的 POI 信息。开发者可以自由定制 POI，从热门地标到小众景点，都能通过代码添加到基于 3DGS 数据构建的地图中：
map.on('click', (e) => {//获取拾取坐标const coor = e.coord;//放个小方块标注拾取位置modelLayer.addPoints({type: 'cube',size: 0.4,color: '#00ff00',data: [{coordinate: coor}],});//飞行定位到拾取位置map.flyTo({ center: coor, zoom: 20 });//在拾取位置创建POIlet yc_div = document.createElement('div');yc_div.className = 'div_bt';yc_div.innerHTML = '您点击了这！';modellayer.addMarker({id: 'poi',data: [{element: yc_div,position: [coor[0], coor[1], coor[2] + 1]}],});});
在文化旅游应用中，用户只需点击感兴趣的景点，即可通过精准定位和丰富的POI信息，获取景点的历史背景、文化价值以及周边推荐等内容，让探索之旅更加生动有趣。
Mapmost
在三维场景中快速测量距离、计算面积？
Mapmost SDK 内置三维量测工具，支持在 3DGS 数据、倾斜模型、矢量数据之间进行精准测量。
首先需要在<head>标签引入三维量测插件。
<head><script src="https://delivery.mapmost.com/cdn/sdk/plugins/mapmost-webgl-measure3D/v1.1.0/mapmost-webgl-measure3D.js"></script></head>
js模块里面添加如下代码，用户只需两行代码开启距离或者面积量测。
//量测工具初始化let measure = new Measure3D(map);// 开启距离测量measure.setType("distance");// measure.setType("area"); //开启面积测量
量测结果实时显示，数据精确可靠，帮助用户快速获取 3DGS 数据中的关键空间信息，为基于 3DGS 数据的项目规划、资源分配等决策提供有力的数据支撑。
Mapmost
Mapmost SDK for WebGL 全面开放3DGS功能，并提供数据、服务、交互、模型、可视化、特效、分析共7⼤类400+API，现在申请即可免费体验！
👉申请免费试用：https://www.mapmost.com/#/layout/webgl/home
👉查看详细操作文档：https://www.mapmost.com/mapmost_docs/webgl/latest/editor
fba98ed95b4.png" class="rich_pages wxw-img" data-ratio="0.45092592592592595" data-type="png" data-w="1080" width="1080" data-imgfileid="100006445" src="https://cdn.10100.com/content/20251218/65f49a44-98fe-44c0-853a-9fba98ed95b4.png">
如有相关技术/项目需求
欢迎扫描二维码与我们联系
电话：0512-67632002