gltf-pipeline的git地址:https://gitcode.net/mirrors/analyticalgraphicsinc/gltf-pipeline
1.全局安装:
npm install -g gltf-pipeline
2.打开cmd,路径切换到需要压缩的gltf文件所在的目录,例如有一文件model.gltf需要压缩:
执行:
gltf-pipeline -i model.gltf -j -d
即可输出压缩后的文件model-processed.gltf.
3.若想查看gltf文件中的贴图和网格信息,可执行:
gltf-pipeline -i model.gltf -o test.gltf -t
注意:gltf中的贴图文件是不能被压缩的,若文件中的纹理贴图占的比重很大,则使用此插件进行压缩效果也不是太理想。最好去压缩图片来解决文件大的问题。
下载draco文件draco文件地址 https://download.csdn.net/download/qq_15023917/85024262 放入public文件夹下
引入DRACOLoader,其实加载压缩过的gltf文件所需的代码只比之前加载普通的gltf文件多了三行代码,详细代码如下:
import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader";
import { DRACOLoader } from "three/examples/jsm/loaders/DRACOLoader";
//加载gltf文件
var loader = new GLTFLoader();
let dracoLoader = new DRACOLoader();
dracoLoader.setDecoderPath("draco/");
loader.setDRACOLoader(dracoLoader);
loader.load(
"model-process.gltf",
function(gltf) {
var model = gltf.scene;
scene.add(model);
},
function(xhr) {
var percentage = Number(((xhr.loaded / xhr.total) * 100).toFixed(0));
},
function(error) {
console.log("load error!" + error.getWebGLErrorMessage());
}
);