cesium怎么下载glb模型

### 如何在 Cesium 中下载 GLB 模型 在 Cesium 中加载和操作 GLB 模型之前，通常需要先获取这些模型文件。以下是关于如何在 Cesium 中下载 GLB 模型的相关说明。 #### 1. 获取 GLB 文件 GLB 是一种高效的二进制格式，广泛应用于三维建模领域。可以通过以下方式获得 GLB 文件： - **在线资源库**: 可以访问公开的 3D 模型网站，例如 [Sketchfab](https://sketchfab.com/) 或者官方提供的沙盒环境链接[^1]中的地址 `https://sandcastle.cesium.com/SampleData/models/CesiumAir/Cesium_Air.glb` 来直接下载所需的 GLB 文件。 - **自定义创建**: 如果需要特定的模型，则可以利用工具链自行制作。例如，在 3ds Max 创建并导出 FBX 格式的模型之后，将其导入 Blender 转换为 GLB 格式[^2]。 #### 2. 使用代码实现动态请求下载功能 如果希望程序能够自动完成 GLB 文件的下载任务而不是手动操作的话, 则可通过 JavaScript 编写一段简单的脚本来执行 HTTP GET 请求来抓取远程服务器上的目标文件: ```javascript async function downloadGlbModel(url) { const response = await fetch(url); if (!response.ok) throw new Error('Network response was not ok'); // 将响应体转换为Blob对象以便保存到本地磁盘上 const blob = await response.blob(); const link = document.createElement('a'); link.href = URL.createObjectURL(blob); link.download = 'model.glb'; // 设置默认文件名 document.body.appendChild(link); link.click(); // 自动触发点击事件模拟用户行为 setTimeout(() => { // 清理临时DOM节点防止内存泄漏 window.URL.revokeObjectURL(link.href); link.remove(); }, 0); } // Example usage: const modelUrl = "https://sandbox.cesium.com/SampleData/models/CesiumMan/Cesium_Man.glb"; downloadGlbModel(modelUrl).catch(console.error); ``` 上述函数接受一个参数即为目标 GLB 的网络路径 (url)，通过调用 Fetch API 发起异步请求读取远端数据流，并最终封装成 Blob 对象供浏览器处理下载逻辑。 #### 3. 集成至 Vue+Cesium 应用场景下 对于现代前端框架如 Vue.js 结合 Cesium 开发的应用而言，除了单纯提供静态资产外还可能涉及按需加载外部依赖项的情况。此时可参照如下方法集成前述提到的功能模块： 首先确保项目已安装必要的依赖包： ```bash npm install cesium axios --save ``` 接着修改入口组件代码片段如下所示： ```html <template> <div id="cesiumContainer"></div> </template> <script lang="ts"> import * as Cesium from 'cesium'; import axios from 'axios'; export default { name: 'App', data() { return {}; }, mounted(): void { this.initViewer(); }, methods:{ initViewer(){ let viewer = new Cesium.Viewer('cesiumContainer',{ shouldAnimate : true, }); viewer.scene.primitives.add(new Cesium.ModelPrimitive({ asynchronous:false, show:true, modelMatrix:Cesium.Matrix4.IDENTITY, uri:'./assets/model.glb' })); } } }; </script> <style scoped> #cesiumContainer{ width:100%; height:calc(100vh - var(--header-height)); } </style> ``` 在此基础上还可以进一步扩展支持动态切换不同类型的三维物体展示等功能特性。 ---