three.js 编辑器的导入导出机制本文围绕three.js 编辑器一款基于 Three.js 的 AI 驱动可视化低代码编辑器展开。- 在线预览 https://z2586300277.github.io/threejs-editor/- GitHub 开源仓库 https://github.com/z2586300277/three-editor- 文档地址 https://z2586300277.github.io/three-editor/docs/dist导入导出是连接编辑器与外部系统的桥梁。three.js 编辑器支持多种格式和方式覆盖了从模型资源到完整场景的不同粒度。模型导入编辑器支持 GLB/GLTF/FBX/OBJ 等主流模型格式。用户可以通过顶部“本地导入”上传文件也可以调用modelCores.loadModel从线上地址加载。模型加载完成后会自动聚焦到视图中央。场景 JSON整个编辑状态可以导出为 JSON包括对象层级、参数、变换、动画和组件状态。这个 JSON 是编辑器的“源文件”可以在不同设备、不同用户之间传递。GLB 导出当需要把场景集成到业务系统时可以导出为 GLB。导出逻辑会排除 TransformControls、Helper、不可见对象等编辑辅助元素只保留最终可见的 Mesh、Group 和 Line。分享链接通过getShareLink可以生成带sceneName参数的 URL。打开链接时编辑器会从线上 JSON 地址加载场景实现一键分发。代码一瞥// 导出 GLBconst exporter new GLTFExporter() exporter.parse(scene, (buffer) { const blob new Blob([buffer], { type: model/gltf-binary }) download(blob, scene.glb) }, { binary: true })