如何压缩glb文件_Gltf模型太大，Threejs加载耗时怎么办？答：Blender导出Gltf可以被gltf-pipeline压缩90%...

安装

npm install -g gltf-pipeline

将glTF转换为Draco glTF

gltf-pipeline -i model.gltf -o modelDraco.gltf -d

压缩前：

压缩后：

“

使用gltf-pipeline作为命令行工具：

将glTF转换为glb

gltf-pipeline -i model.gltf -o model.glb

gltf-pipeline -i model.gltf -b

将glb转换为glTF

gltf-pipeline -i model.glb -o model.gltf

gltf-pipeline -i model.glb -j

将glTF转换为Draco glTF

gltf-pipeline -i model.gltf -o modelDraco.gltf -d

保存单独的纹理

gltf-pipeline -i model.gltf -t

”

使用gltf-pipeline作为库：

将glTF转换为glb：

const gltfPipeline = require('gltf-pipeline');

const fsExtra = require('fs-extra');

const gltfToGlb = gltfPipeline.gltfToGlb;

const gltf = fsExtra.readJsonSync('model.gltf');

gltfToGlb(gltf)

.then(function(results) {

fsExtra.writeFileSync('model.glb', results.glb);

});

将glb转换为glTF

const gltfPipeline = require('gltf-pipeline');

const fsExtra = require('fs-extra');

const glbToGltf = gltfPipeline.glbToGltf;

const glb = fsExtra.readFileSync('model.glb');

glbToGltf(glb)

.then(function(results) {

fsExtra.writeJsonSync('model.gltf', results.gltf);

});

将glTF转换为Draco glTF

const gltfPipeline = require('gltf-pipeline');

const fsExtra = require('fs-extra');

const processGltf = gltfPipeline.processGltf;

const gltf = fsExtra.readJsonSync('model.gltf');

const options = {

dracoOptions: {

compressionLevel: 10

}

};

processGltf(gltf, options)

.then(function(results) {

fsExtra.writeJsonSync('model-draco.gltf', results.gltf);

});

保存单独的纹理

const gltfPipeline = require('gltf-pipeline');

const fsExtra = require('fs-extra');

const processGltf = gltfPipeline.processGltf;

const gltf = fsExtra.readJsonSync('model.gltf');

const options = {

separateTextures: true

};

processGltf(gltf, options)

.then(function(results) {

fsExtra.writeJsonSync('model-separate.gltf', results.gltf);

// Save separate resources

const separateResources = results.separateResources;

for (const relativePath in separateResources) {

if (separateResources.hasOwnProperty(relativePath)) {

const resource = separateResources[relativePath];

fsExtra.writeFileSync(relativePath, resource);

}

}

});

命令行标志

旗

描述

需要--help， -h

显示帮助

没有

--input， -i

glTF或glb文件的路径。

：white_check_mark：是

--output， -o

glTF或glb文件的输出路径。单独的资源将保存到同一目录。

没有

--binary， -b

将输入的glTF转换为glb。

不，默认 false

--json， -j

将输入的glb转换为glTF。

不，默认 false

--separate， -s

编写单独的缓冲区，着色器和纹理，而不是将其嵌入glTF中。

不，默认 false

--separateTextures， -t

仅写出单独的纹理。

不，默认 false

--stats

将统计信息打印到控制台以输出glTF文件。

不，默认 false

--keepUnusedElements

保留未使用的材料，节点和网格。

不，默认 false

--draco.compressMeshes， -d

使用Draco压缩网格。添加KHR_draco_mesh_compression扩展。

不，默认 false

--draco.compressionLevel

Draco压缩级别[0-10]，最大为10，最小为0。值0将应用顺序编码并保留面部顺序。

不，默认 7

--draco.quantizePositionBits

使用Draco压缩时，位置属性的量化位。

不，默认 14

--draco.quantizeNormalBits

使用Draco压缩时，普通属性的量化位。

不，默认 10

--draco.quantizeTexcoordBits

使用Draco压缩时，纹理坐标属性的量化位。

不，默认 12

--draco.quantizeColorBits

使用Draco压缩时，颜色属性的量化位。

不，默认 8

--draco.quantizeGenericBits

使用Draco压缩时，蒙皮属性(关节索引和关节权重)和自定义属性的量化位。

不，默认 12

--draco.unifiedQuantization

使用相同的量化网格对所有图元的位置进行量化。如果未设置，则单独应用量化。

不，默认 false

制作说明

运行测试：

npm run test

要在整个代码库上运行ESLint，请运行：

npm run eslint

要在保存文件时自动运行ESLint，请运行以下命令并在控制台窗口中将其保持打开状态：

npm run eslint-watch

构建CesiumJS集成

CesiumJS使用gltf-pipeline的某些功能作为第三方库。可以使用以下命令生成必要的文件：

npm run build-cesium

这会将gltf管道代码的一部分输出到该dist/cesium文件夹中，以便与浏览器中的CesiumJS一起使用。

运行测试范围

覆盖范围使用nyc。跑：

npm run coverage

有关完整的覆盖范围详细信息，请打开coverage/lcov-report/index.html。

测试和覆盖范围涵盖了Node.js模块；它不包含命令行界面，该界面很小。

产生文件

生成文档：

npm run jsdoc

文档将放置在doc文件夹中。

会费

拉取请求表示赞赏！请使用相同的贡献者许可协议(CLA)和编码指南用于铯。

当前标签

2.1.10                               ...           最新 (2个月前)

1.0.7                               ...           上一个 (4个月前)

36个版本

2.1.10                               ...           2个月前

2.1.9                               ...           4个月前

2.1.8                               ...           4个月前

1.0.7                               ...           4个月前

2.1.7                               ...           4个月前

2.1.6                               ...           5个月前

2.1.5                               ...           5个月前

2.1.4                               ...           9个月前

2.1.3                               ...           一年前

2.1.2                               ...           一年前

2.1.1                               ...           一年前

2.1.0                               ...           一年前

2.0.1                               ...           2年前

2.0.0                               ...           2年之前

1.0.6                               ...           2年前

1.0.5                               ...           2年前

1.0.4                               ...           2年前

1.0.3                               ...           2年前

1.0.2                               ...           3年之前

1.0.1                               ...           3年前

1.0.0                               ...           3年前

0.1.0-alpha15                               ...           3年之前

0.1.0-alpha14                               ...           3年之前

0.1.0-alpha13                               ...           3年之前

0.1.0-alpha12                               ...           3年之前

0.1.0-alpha11                               ...           3年之前

0.1.0-alpha10                               ...           4年之前

0.1.0-alpha9                               ...           4年之前

0.1.0-alpha8                               ...           4年之前

0.1.0-alpha7                               ...           4年之前

0.1.0-alpha6                               ...           4年之前

0.1.0-alpha5                               ...           4年之前

0.1.0-alpha4                               ...           4年之前

0.1.0-alpha3                               ...           4年之前

0.1.0-alpha2                               ...           4年之前

0.1.0-alpha1                               ...           4年之前

本文地址：https://blog.youkuaiyun.com/rexfow/article/details/107378041

如您对本文有疑问或者有任何想说的，请点击进行留言回复，万千网友为您解惑！