
CesiumJS 导出从场景截图到数据导出的保姆级教程【免费下载链接】cesiumAn open-source JavaScript library for world-class 3D globes and maps :earth_americas:项目地址: https://gitcode.com/GitHub_Trending/ce/cesium你用 CesiumJS 搭好的三维场景关浏览器就没了。这篇讲清 CesiumJS 导出的两条路场景截图和 KML 数据导出看完你能把当前视角存成 PNG把场景数据交付给 Google Earth。想把场景放进汇报总不能只截个屏吧你八成遇到过这两种情况演示时的三维城市视角刚调好一关浏览器素材就没了合作方要场景里的实体数据可他们只用 Google Earth读不了你的源数据。CesiumJS 导出解决的就是这两类问题一是把当前视角存成 PNG 图片二是把场景实体变成 KML 或 KMZ 文件KMZ 是带附件压缩成单包的 KML。两者都是引擎自带能力不用装第三方库。方向明确了先出一张图。 3 分钟出第一张CesiumJS 导出快速跑通存档当前视角第一步做什么截图就是画布元素页面渲染的容器导一张图6 行代码const viewer new Cesium.Viewer(cesiumContainer); viewer.scene.render(); const a document.createElement(a); a.href viewer.canvas.toDataURL(image/png); a.download cesium-view.png; a.click();跑完就能看到 cesium-view.png 落在下载目录画面就是画布里当前的三维地球视角所见即所得图存好了接下来看怎么把数据交给对方。CesiumJS KML 导出这 4 个参数必须调对调用 Cesium.exportKml 之前参数该怎么调真正要盯的只有 4 个参数作用推荐值常见坑entities要导出的实体集合dataSource.entities漏传直接抛 entities is requiredkmzKML 连同附件压缩成单文件true设 false 只返回 KML 字符串和外部文件 BlobmodelCallbackglTF 模型转换回调场景有模型时必传不传会抛 RuntimeErrorsampleDuration时变属性采样间隔秒60太小文件膨胀太大轨迹稀疏参数理顺了再看看还能玩出什么花样。进阶组合多角度批量截图与模型 KMZ 交付一张图不够用还有两种玩法。多角度批量截图每次拍照前先用viewer.camera.setView把相机转到预设方位等一帧渲染完成再 toDataURL循环即可。俯视、斜视、特写5 个角度出 5 张图全程脚本完成。适合做汇报、交付需要多角度素材的人。把三维模型装进 KMZKML 不认识 glTF需要在 modelCallback 里返回一个 ColladaGoogle Earth 认的三维模型格式路径把模型和纹理的 Blob 塞进 externalFiles引擎会自动打包进 KMZ官方示例 export-kml 里就有可跑通的 demo适合需要把带模型的场景交付给 Google Earth 用户的人。图和文件都齐了但有几个地方最容易翻车。做 CesiumJS 导出的人踩过的坑替你排好了截图是空白图 → 首帧没渲染完就调了 toDataURL → 截图前先调 render()或等场景加载完成。报 entities is required → 没传 entities 参数 → 传对应数据源的集合如 viewer.dataSources[0].entities。场景里有模型就抛异常 → KML 不支持 glTF 且未传 modelCallback → 回调里返回 .dae 路径并嵌入模型文件。时变轨迹导出后变成一个静态点 → 时变属性只按 options.time 取值 → 传入合适的 time或调 sampleDuration 控制采样密度。KMZ 在 Google Earth 打不开 → 模型 href 写成了 glTF 链接 → 换成内嵌在 KMZ 里的本地 Collada 文件。汇报的图、交付的数据两条路都通了。想弄清哪些实体类型能导出去看 exportKml 源码注释里写得很细。【免费下载链接】cesiumAn open-source JavaScript library for world-class 3D globes and maps :earth_americas:项目地址: https://gitcode.com/GitHub_Trending/ce/cesium创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考