:GaussianSplatLayer 高斯泼溅图层)
ArcGIS JS 基础教程23GaussianSplatLayer 高斯泼溅图层零、写在前面一、功能介绍二、功能实现三、功能应用四、核心代码五、在线示例六、关键 API 说明七、系列导航零、写在前面本系列教程完整目录ArcGIS JS 系列基础教程100个项目常用热门功能在线示例完整可运行的 HTML 示例无需任何环境配置可直接在浏览器中打开体验️专栏导航收藏 关注专栏文章第一时间送达❤️一键三连点赞给教程充电 评论提问必回 收藏下次再看一、功能介绍GaussianSplatLayer是 ArcGIS JS5.0 全新引入的图层类型。通过高斯泼溅技术渲染数百万半透明椭球体能呈现极高细节的逼真 3D 模型。参考GaussianSplatLayer API二、功能实现constlayernewGaussianSplatLayer({portalItem:{id:01596d71a5ce40ec8a6f21baad6e5b6f}});map.add(layer);三、功能应用场景说明高精度巡检电力线/铁塔细节呈现文化遗产古建筑精细复现高逼真3D替代传统3D模型渲染四、核心代码sample/lesson23_gaussian_splat.html!DOCTYPEhtmlhtmllangzh-CNheadmetacharsetUTF-8metanameviewportcontentwidthdevice-width, initial-scale1.0title第23课GaussianSplatLayer 高斯泼溅/titlelinkrelstylesheethrefhttps://js.arcgis.com/5.0/esri/themes/light/main.cssscripttypemodulesrchttps://js.arcgis.com/5.0//scriptstyle*{margin:0;padding:0;box-sizing:border-box;}body{font-family:Microsoft YaHei,sans-serif;}#mapContainer{width:100vw;height:100vh;}.page-title{position:absolute;top:20px;left:50%;transform:translateX(-50%);background:rgba(255,255,255,0.95);padding:10px 24px;border-radius:6px;font-size:18px;font-weight:bold;z-index:100;box-shadow:0 2px 8pxrgba(0,0,0,0.15);}.status{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.7);color:white;padding:8px 20px;border-radius:20px;font-size:13px;z-index:100;pointer-events:none;}/style/headbodyh1classpage-title第23课GaussianSplatLayer 高斯泼溅/h1divclassstatusidstGaussianSplat | 加载中.../divdividmapContainer/divscripttypemoduleconstMapawait$arcgis.import(arcgis/core/Map.js);constSceneViewawait$arcgis.import(arcgis/core/views/SceneView.js);constGaussianSplatLayerawait$arcgis.import(arcgis/core/layers/GaussianSplatLayer.js);constgetTiandituawait$arcgis.import(https://openlayers.vip/examples/resources/tianditu.js);consttlgetTianditu.default({type:vec_w});constmapnewMap({basemap:{baseLayers:[tl.base,tl.anno]}});constviewnewSceneView({container:mapContainer,map,zoom:15,center:[108.8,15.2]});window.viewview;// GaussianSplatLayer — 5.0 新特性通过 portalItem 加载官方示例越南工业区constgsnewGaussianSplatLayer({portalItem:{id:01596d71a5ce40ec8a6f21baad6e5b6f},elevationInfo:{mode:absolute-height,offset:10}});map.add(gs);awaitview.when();awaitgs.load();try{view.goTo(gs.fullExtent,{duration:2000,easing:cubic-out});document.getElementById(st).textContentGaussianSplat | 5.0新特性已加载;}catch(e){document.getElementById(st).textContentGaussianSplat | 加载失败(ee.message?e.message:e);console.error(e);}/script/body/html五、在线示例在线体验https://southjor.github.io/arcgis-examples/lessons/lesson23.html六、关键 API 说明API说明new GaussianSplatLayer({ portalItem })通过 portalItem 加载高斯泼溅官方示例 idelevationInfo高程贴合3D 必配view.whenLayerView(layer)等待图层渲染就绪参考链接GaussianSplatLayer API七、系列导航⬅️上一篇ArcGIS JS 基础教程22BuildingSceneLayer 建筑场景图层➡️下一篇ArcGIS JS 基础教程24VectorTileLayer 矢量切片图层小贴士GaussianSplatLayer是 ArcGIS JS5.0 全新引入的图层通过数百万半透明椭球体高斯泼溅呈现极高细节的逼真 3D 模型是传统 3D 模型渲染的有力替代。使用时注意它是 5.0 新特性需配合支持该版本的 SDK3D 场景务必设置elevationInfo才能正确贴合地面加载失败多为 portalItem 不可达或所在区域无数据。