ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

CesiumJS 导出完整指南:截图、录像、数据导出 3 类需求一次说清

CesiumJS 导出完整指南:截图、录像、数据导出 3 类需求一次说清 CesiumJS 导出完整指南截图、录像、数据导出 3 类需求一次说清【免费下载链接】cesiumAn open-source JavaScript library for world-class 3D globes and maps :earth_americas:项目地址: https://gitcode.com/GitHub_Trending/ce/cesium你在 CesiumJS 里搭好 3D 地理可视化场景后总要把成果带出去截一张图、录一段视频或把地理数据导出成文件。这篇 CesiumJS 导出指南覆盖截图、录像、数据导出三条路按先选型、后操作的顺序讲清楚每一步怎么做关键处都标了接口名和源码位置。 CesiumJS 导出选型截图、录像、数据导出各适合什么要画面、要过程还是要数据先想清楚再动手三者产物完全不同需求适合场景产物CesiumJS 截图汇报配图、成果存档只要当前这一帧单张 PNGCesiumJS 录像相机飞行、实体动画、时间动态的全过程一段视频CesiumJS 数据导出把实体、属性、时间信息交给其他软件继续用GeoJSON / CZML / KML 文件 CesiumJS 截图如何把当前场景存成 PNG要的是当前这一帧时走这条路。CesiumJS 把场景渲染在 Canvas 上你用 toDataURL 把画布转成 PNG 数据串再触发浏览器下载即可。你调用 toDataURL 时实际发生的是浏览器把 WebGL 画布当前帧读回内存并编码成图片数据全程不用手动搭管道。注意等场景完全加载后再截——瓦片、模型、后处理都渲染完再动手否则会截到半成品。 CesiumJS 录像帧率与分辨率怎么选要的是过程时走录像路线。CesiumJS 没有内置录像接口标准做法是用浏览器原生的 MediaRecorder 包一层你对 canvas 的 captureStream() 开始录制实际发生的是浏览器把逐帧画面流实时编码成视频文件相机移动、实体动画、时间动态都能被完整录下。帧率建议 30fps文件体积和流畅度平衡得最好分辨率跟随 Canvas 实际尺寸按需缩放。注意编码会占用性能硬件有限时先把分辨率降下来再开录避免录制过程卡顿。 CesiumJS 数据导出GeoJSON、CZML、KML 各管什么要的是数据而不是画面时把实体导出成对应格式即可三者分工明确GeoJSON管点、线、面等几何要素GIS 工具拿来即用CZML管时间动态数据位置、样式随时长变化的内容可完整保留KML管第三方兼容Google Earth 等工具直接打开加载端源码在 GeoJsonDataSource.js、CzmlDataSource.js、KmlDataSource.js导出侧的完整示例见 export-kml里面演示了 exportKml 接口和把模型、贴图打包进 KMZ 的完整流程。提醒选格式只看下游——给 GIS 用选 GeoJSON要时间回放选 CZML给 Google Earth 用户选 KML。 进阶脚本控制相机批量自动截图与自定义导出参数需要多角度、多场景出图时用脚本驱动相机逐个飞到位、每停稳一帧截一次比手动快且角度可控。仓库的端到端测试页 CesiumPage.js 就是一个 Playwright 驱动的 CesiumJS 页面封装可以直接参考它做无头批量出图。自定义导出与渲染参数则看引擎源码分辨率缩放、后处理等开关集中在 Scene.js改这里的配置就能控制出图质量与格式。三条路各归各位画面存 PNG、过程存视频、数据存 GeoJSON/CZML/KML对照开头的选型表对号入座就能开工。【免费下载链接】cesiumAn open-source JavaScript library for world-class 3D globes and maps :earth_americas:项目地址: https://gitcode.com/GitHub_Trending/ce/cesium创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表