时间戳

首页 > 解决方案 > 如何减少/压缩three.js GLTF模型大小（带有.bin和纹理）？

reactjs - 如何减少/压缩three.js GLTF模型大小（带有.bin和纹理）？

问题描述

我正在为我的网站加载一个地球仪的 3d 模型，下载需要很长时间。

我正在使用 将GLTFLoader模型加载到里面React。

  loadModals() {
    const loader = new GLTFLoader()
    loader.load(
      "/models/scene.gltf",
      gltf => {
        object = gltf.scene.children[0]
        scene.add(object)
        console.log("Model loaded")
      },
      xhr => {
        console.log("Model loading...")
      },
      error => {
        console.log("Model failed to load", error)
      }
    )
  }

与 3d 模型相关的文件包括：

从研究来看，如果模型附带一个.bin文件，这意味着它gltf不是压缩二进制格式。但是，查看诸如gltf-pipeline在线之类的工具，我不确定当有单独的文件（如纹理文件夹和scene.bin.

我对three.js 和网络中的实现非常陌生，因此将不胜感激任何建议。

谢谢！

标签： reactjsthree.jsgltf

解决方案

如果您只需要压缩纹理，则有多个图像压缩网站。

为什么不使用 .glb 格式？GLB 文件格式是 GLTF 的二进制形式，其中包括纹理，而不是将它们作为外部图像引用。

对不起，如果我不帮你。

推荐阅读