- 综合排序
- 最热优先
- 最新优先
- 来自专栏acoolgiser_zhuanlan
bat 批处理 脚本 for循环 批量压缩gltf模型 gltf批量压缩 gltf压缩转成glb
bat 批处理 脚本 for循环 批量压缩gltf模型 gltf批量压缩 gltf压缩转成glb 这里参考两篇文章： 1. ，就可以直接通过下面一句命令安装gltf-pipeline这个库： npm install -g gltf-pipeline 安装完成后，按照官方地址的使用说明，直接对模型进行压缩即可，比如： gltf-pipeline -i model.gltf -o modelDraco.gltf -d 就可以把model.gltf模型压缩。 （-d表示使用draco算法进行压缩） for %i in ('dir *.gltf /s /b') do gltf-pipeline -i %i -o %i -d ? 看一下压缩后的模型大小： ? 是如何达到压缩效果的，gltf和glb这两种格式的区别，转换和压缩的原理是什么。 （学海无涯，只有不断深究，才会真正的进步，与君共勉） 微信搜索：acoolgiser，一起学习成长，交个朋友！
2.4K10发布于 2020-12-16 - 来自专栏前端之攻略
gltf格式的压缩文件在threejs中展示
在H5中引入3D模型往往存在资源太大，可以通过模型网格压缩，通过glTF配合Draco压缩的方式，可以在视觉效果近乎一致的情况下，让3D模型文件成倍缩小 glTF在线查看器： https://gltf-viewer.donmccurdy.com 一、通过Draco进行压缩 Draco及gltf-pipeline的介绍 Draco是Google推出的一个用于3D模型压缩和解压缩的工具库，glTF资源可通过、Draco开发命令行工具gltf-pipeline 进行编码压缩，gltf-pipeline可通过npm的方式安装使用，使用方法如下： #全局安装 npm install -g gltf-pipeline #压缩glb文件 -b表示输出glb格式， -d 表示压缩 gltf-pipeline -i model.glb -b -d #压缩glb文件并将纹理图片分离出来 gltf-pipeline -i model.glb -b -d -t 更多参数查阅 文件， 通过命令行工具 gltf-pipeline -i test.glb -o test1.glb -d 则可以生成压缩后的test1.glb文件 2、把解码文件node_modules>three
4K51发布于 2020-12-08 - 来自专栏LET
glTF简介
概述 glTF简介，Web端三维模型及其特点 Cesium如何加载，渲染glTF，逻辑结构和关键技术 个人总结，从glTF学习如何设计一个二进制格式，个人想法分享 关键字：Cesium glTF WebGL 也就是今天要讲的glTF模型渲染。 glTF的全称是GL传输格式，是一种针对GL(WebGL，OpenGL ES以及OpenGL)接口的运行时资产(asset)。 因此glTF还包含整个场景的关系，包括节点，变换矩阵，变换的层级关系，网格，材质，相机和动画，试图保存所有信息。这是一个场景树的逻辑，算是glTF的一个优化。 比如glTF提供了扩展，提供了场景树，相机的信息，这都是出于通用性的考虑，但这个是否实用，就不好判断了。或者是否提供ZIP压缩。 ▽Accessor&Json表述 这是glTF数据读取的机制，设计的很优雅，很值得我们学习。
3.9K100发布于 2018-06-20 - 来自专栏LET
glTF（二）：PBR
glTF glTF是一个优秀的三维数据规范，其中有很多细节都值得我们学习，按照我的理解，可以分为三大块： Accessor数据访问机制 一套访问二进制数据的规范，将逻辑层和数据层隔离 同传输和读取以及存储灵活性上都有上佳表现 ：Mesh与Primitive中的Vertex Buffer， Index Buffer，Vertex Array，还有Texture与State Management，在灵活和易用上都有不错的设计 压缩 ： 针对3D Geometry的Draco压缩#6191 Scene& Node 节点间的依赖和位置关系 实例化设计 glTF2.0 相比1.0，glTF2.0的改变可以用“一增一删修修补补”来概括，主要有 这里，glTF的采用的是Disney给出的BRDF公式： ? ，diffuse采用的是Lambert模型： ? (G)eometric term 表示从L光源能够到达V视角的概率，这里glTF采用的是GGX，而Cesium则是Schlick模型： ?
3.5K60发布于 2018-06-20 - 来自专栏3Dconvert
Revit导出为GLTF
Revit与GLTF格式简介Revit是Autodesk公司一套系列软件的名称。Revit系列软件是为建筑信息模型构建的，可帮助建筑设计师设计、建造和维护质量更好、能效更高的建筑。 GLTF是由OpenGL和Vulkan背后的3D图形标准组织Khronos所定义，成为Web上的3D对象标准。GLTF文件格式包括场景、摄像机、动画、网格、材质、纹理、渲染技术、着色器等元素。 Revit文件导出为GLTF格式Revit文件和GLTF格式都有广泛的用途，在模型应用工作中，经常需要将Revit文件导出为GLTF格式，怎么将Revit文件导出为GLTF格式呢？ 3Dconvert for Revit插件支持将.rvt，.rfa，.adsk，.rte等Revit格式文件，转换为8种目标格式：GLTF、OBJ、GLB、DAE、STL、OFF、XYZ和PLY。 在插件页面选择需要转换的目标格式，目前插件支持8种目标格式：GLTF、OBJ、GLB、DAE、STL、OFF、XYZ和PLY。选择需要导出的目标格式：GLTF。
1.6K10编辑于 2023-12-01 - 来自专栏LET
glTF(2.1): PBR
去年针对glTF的PBR材质，写过一篇文章。但重读这篇文章，觉得自己没讲到点子上。今天终于有时间，想着重新梳，重写一下。 Rasterization的不足 ? BRDF 上面的光学公式就剩下f这个函数的定义了，glTF里采用的是Disney提供的Microfacet（显微镜） model，简单说，就是这个材质可以模拟各种光学现象，fragment的朝向差别较大 但glTF基于《Unreal Engine's course notes on real-time PBR》进行了预处理，优化性能。 ? 这个预处理的依据就是如上的公式。
2.3K20发布于 2019-03-18 - 来自专栏计算机图形学 前端可视化 WebGL
UE导入FBX、GLTF模型
导入GLTF 由于webgl用gltf比较多，所以手上模型多是gltf格式。 UE有插件可以导入gltf 。比如gltf for UE4， 另外一个出名的就是Datasmith，是一个官方的插件。
4K10编辑于 2022-09-26 - 来自专栏代码编写世界
DEM转换为gltf
概述 DEM（地形文件）天然自带三维信息，可以将其转换成gltf模型文件。DEM是栅格数据，可以通过GDAL进行读取；gltf是一种JSON格式，可以采用nlohmann/json进行读写。 2. GDALAllRegister(); CPLSetConfigOption("GDAL_FILENAME_IS_UTF8", "NO"); //支持中文路径 my_json gltf ; gltf["asset"] = { {"generator", "CL"}, {"version", "2.0"} }; gltf["scene "] = 0; gltf["scenes"] = { {{"nodes", {0} }} }; gltf["nodes"] = { {{"mesh 参考 [1] github上的gltf教程 [2] gltf教程中文翻译 [3] nlohmann/json关于保留插入顺序的讨论
1.5K40发布于 2020-01-14 - 来自专栏代码编写世界
WebGL简易教程(十五)：加载gltf模型
纹理数据可以使用jpg文件，方便压缩和传输。 从以上特性可以看出，glTF特别方便与互联网的使用场景，便于传输且预处理程度小。 数据 使用的地形glTF文件已经处理好并上传到文章末尾的地址中（具体的转换过程可以参看《DEM转换为gltf》）。 将这个数据导入到glTF Viewer网站上查看，显示结果如下： ? flag) { alert("没有找到gltf"); } }); 这段代码看起来很繁复，其实原理很简单：遍历加载的文件，对于gltf文件采用FileReader.readAsText 《WebGL编程指南》 2.glTF格式详解(目录) 3.glTF Tutorial 4.前端H5中JS用FileReader对象读取blob对象二进制数据，文件传输 5.gltf2.0规范
6K20发布于 2020-02-14 - 来自专栏前端漫步
Cesium入门之九：Cesium加载gltf文件
glTF文件介绍 glTF（Graphics Library Transmission Format）是一种用于存储3D模型和场景的格式。 glTF文件包含了设计场景或模型的几何形状、材质、纹理、动画等信息，同时有很好的兼容性和可扩展性。glTF文件基于JSON格式，具有易于阅读和修改的特点，同时也易于使用编程语言进行解析和使用。 glTF支持两种文件格式：*.glTF和 *.glb。 glTF文件易于阅读、修改和编辑，同时可以使用gzip进行压缩以减小文件大小。但是.glTF文件格式在处理复杂场景时，可能会变得比较冗长，处理速度较慢。 glb文件也可以使用gzip压缩以进一步减小文件大小。但是.glb文件格式作为二进制文件，难以直接进行编辑和修改。
5.6K31编辑于 2023-10-14 - 来自专栏腾讯社交用户体验设计
如何在页面极速渲染3D模型
而通过 glTF 配合 Draco 压缩的方式，可以在视觉效果近乎一致的情况下，让3D模型文件成倍缩小。下面具体介绍 glTF 格式及 Draco 压缩工具。 1. 通过 Draco 进行压缩 Draco 及 gltf-pipeline 介绍 Draco 是 Google推出的一个用于 3D 模型压缩和解压缩的工具库，上述介绍的 FBX2glTF 及 COLLADA2GLTF 工具也嵌入了 Draco 压缩功能，除此之外，glTF 资源可通过基于 Draco 开发的命令行工具 gltf-pipeline 进行编码压缩，gltf-pipeline 可通过 npm 的方式安装使用 但在 gltf-pipeline 或其他压缩工具中，压缩程度可通过设置参数进行调整，如下所示： ? 另外经过压缩的 glTF 文件仅为正常 FBX 和 glTF 文件的1/10左右，而在视觉上三者几何体结构没有明显的差异，压缩后的 glTF 开启了 worker 线程做 Draco解码，多了一小部分模型解码时间
9.3K32发布于 2019-12-12 - 来自专栏计算机图形学 前端可视化 WebGL
WebGL压缩纹理实践
而我们最终选用的也就是ktx2.0，它能够很方便的和gltf模型格式进行集成。 有关压缩纹理的更多知识，大家可以在网上搜索啊，此处不进行详细的介绍。 0x02 工作流 建模工程师给的是OBJ模型，项目最开始用的也是OBJ模型，首先我们需要把OBJ模型转换成GLTF格式。 可以使用插件obj2gltf进行转换。 转换的流程大致如下： npm install obj2gltf -g obj2gltf -i a.obj -o a.gltf 首先通过npm安装obj2gltf。 然后通过obj2gltf 进行模型的转换，其中 -i表示输入的OBJ模型。-o就是输出的gltf模型。 转换为gltf之后，通过对gltf进行压缩。 压缩的命令大致： gltfpack -i scene.gltf -o scene.glb --tc 其中tc是对贴图进行压缩，原文如下：gltfpack can also compress textures
2.6K10编辑于 2022-09-28 实测｜用 DracoOptimizer 把 glTFGLB 模型压缩到极致：体积减90%，Web3D加载快到飞起
实测｜用 DracoOptimizer 把 glTF/GLB 模型压缩到极致：体积减90%，Web3D加载快到飞起面向 Web3D / Three.js 开发者的轻量桌面工具：一键压缩 + 批量处理 + （上手成本高），要么是在线工具（批量处理受限），因此我基于 Draco 官方算法做了一款轻量桌面工具 DracoOptimizer，专注解决「glTF/GLB 模型压缩」这一件事，兼顾易用性和压缩效果。 人物角色（glTF）15.6 MB4.7 MB 69.9%细节轻微损失（可接受）场景模型（GLB） 32.1 MB10.5 MB67.3%无核心细节损失 注：压缩等级为 8（平衡体积/质量 核心使用流程步骤 1：选择压缩对象单文件：点击「选择文件」，支持 .gltf/.glb 格式批量处理：点击「选择文件夹」，自动筛选文件夹内所有 glTF/GLB 文件步骤 2：设置压缩等级推荐等级：7~ （顶点、面、UV 等）应用 Draco 算法压缩几何信息生成压缩后的文件（默认后缀：_compressed.glb/_compressed.gltf）分屏展示压缩前/后模型（可旋转、缩放对比细节）步骤
55710编辑于 2026-02-12- 来自专栏用户9379088的专栏
Three.js 之 Import Model 导入模型
GLTF formats虽然 GLTF 就是一种格式，但是其内部包含了其他格式。 例如你想修改纹理贴图，换一张更压缩的贴图时，就会比较麻烦，因为这些数据都是被集合在了一起，同一个二进制文件中。 glTF-Draco有点像说的第一个格式，不过使用了 Draco algorithm 来压缩几何体的数据。如果你对比 .bin 文件的大小，你就会发现这个会更小一点。 如果想要每个模型一个文件，并且不关心模型内的素材修改，那么二进制 glTF-Binary 更适合。在这两种情况下，您都必须决定是否要使用 Draco 压缩，但我们稍后会介绍这部分。 (error) => { console.log('error') console.log(error) },)复制代码我们也可以尝试其他的格式导入，除了 Draco 压缩格式外，其他都生效了
7.3K30编辑于 2022-08-10 - 来自专栏前端漫步
Threejs入门之二十五：Threejs加载gltf文件
这一节我们来通过Threejs加载一个glft格式的三维模型文件，首先我们先简单了解下gltf文件gltf文件gltf文件全称Graphics Language Transmission Forma（图形语言传输格式 gltf文件核心是JSON文件，一个gltf文件可传输一个或多个场景， 包括网格、材质、贴图、蒙皮、骨架、变形目标、动画、灯光以及摄像机等信息。 加载gltf文件下面通过代码实现加载一个gltf格式的文件到场景中，首先还是需要创建场景、相机、渲染器等初始化代码，具体步骤查看前面章节，代码如下页面初始化import * as THREE from 这里我们在加载gltf文件成功后，打印该gltf，看下里面的数据结构，并在加载成功后，将其加入到scene中loader.load('.. /models/motor03.gltf',function(gltf) { console.log(gltf); scene.add(gltf.scene) })刷新浏览器，查看效果
9.3K31编辑于 2023-05-19 - 来自专栏3d图表
一款面向 Web3D 的桌面端模型压缩工具：Draco Editor
Draco Editor 是一款面向 Web3D 场景的桌面端模型优化工具，支持离线部署与本地化处理，专注于 glTF/GLB 模型的 Draco 压缩与格式转换。 多格式模型转换：支持 glTF, GLB, FBX, OBJ, STL, DAE, PLY 等主流 3D 格式互转。 Draco 模型压缩优化 (Optimize) 这是 Draco Editor 的核心功能，用于对 glTF/GLB 模型进行高质量几何压缩，适用于 Web3D 资源发布与传输加速。 压缩设置： Draco 压缩级别：1-10 级可选（推荐 7 级），级别越高压缩率越大，但解析耗时也越长。 目标格式：可选择导出为 .glb (推荐) 或 .gltf。 支持导入格式：glb, gltf, obj, fbx, stl, dae, ply 支持导出格式：glb, gltf, obj, stl, ply 3.
23310编辑于 2026-03-12 - 来自专栏Java知识图谱
Nginx网络压缩 CSS压缩 图片压缩 JSON压缩
1、网络压缩原理 网络压缩的原理是消耗CPU资源，减少文件在公网传输的大小，提高响应速度。 二、网络压缩 此部分所有的压缩内容在浏览器端都会还原，特别需要指出的是图片，图片在网络间是压缩状态传输的，到达浏览器后是会被还原的。 技术实现依托gzip压缩，仅仅在服务器与客户端网络传输时对静态资源进程压缩，文件的大小在压缩前与还原后保持不变。 图片压缩分为两类：一是等比压缩；二是固定宽高压缩。根据应用场景的不同也分为两类：一是固定参数；二是动态参数。 此部分图片压缩后到达浏览器不会被还原。 （一）等比压缩 使用关键词resize实现等比压缩，指定宽度或者高度即可在原尺寸图片的基础上等比率压缩图片。如果同时指定宽度和高度，只有一个参数生效。
6.7K41编辑于 2022-02-08 - 来自专栏javascript技术
Three.JS编程中如何切换gltf模型动画？
在Threejs编程中，处理GLTF模型动画的切换主要涉及对模型中的动画剪辑（AnimationClip）进行管理和播放控制。下面的代码，展示如何在Three.js中切换GLTF模型的动画。 步骤 1: 加载GLTF模型首先，你需要使用GLTFLoader来加载包含动画的GLTF模型。 ', function ( gltf ) { scene.add( gltf.scene ); // 假设gltf.animations是一个包含所有动画剪辑的数组 const mixer = new THREE.AnimationMixer( gltf.scene ); // 你可以存储这些剪辑以供后续使用 let clips 通过这些步骤，就能够在Three.js中实现加载、播放和切换GLTF模型的动画。
1.1K20编辑于 2024-09-04 - 来自专栏CloudBest
干货 | 2D+1D | vivo官网Web 3D应用开发与实战
4.3 性能优化 4.3.1 模型压缩 为了提升页面初始化的加载速度以及切换颜色模型时的解析速度，我们在制作完成模型后，需要对模型进行压缩以降低模型的体积量。 谷歌针对GLB模型有一个压缩库Draco 3D，可以在不影响模型展示效果的情况下，对模型的体积进行压缩。可以利用GLTF Pipeline命令行对GLTF模型进行压缩。 压缩的步骤： 1、安装gltf-pipeline npm install -g gltf-pipeline 2、转换gltf至glb文件 Converting a glTF to glb gltf-pipeline -i model.gltf -o model.glb gltf-pipeline -i model.gltf -b 压缩之后，glb文件的体积会减少80%左右，所以在加载速度和效果呈现上会比原始的GLTF 注：图片来自网络（https://cesium.com） 4.3.2 模型解压缩 ThreeJs有针对压缩模型的解压缩方案: // Instantiate a loader const loader =
2.6K40发布于 2021-04-20 - 来自专栏web三维
【解决】大尺寸自制城市模型和webgis配准对齐问题
首先复现问题：一、复现问题如图cesium加载了一个天津市gltf模型，整体尺寸较大。拉近地图，在模型中心位置，建筑物和地面影像很好的重叠，并且贴合地面。 进而我们需要解决4个问题1、要对GIS数据进行自动化分割2、将分割的小块gis数据转模型，并且有经纬度信息3、最好还能对模型进行压缩4、生成的模型可以拼接在webgis上浏览使用Geobuilding软件自动分割 软件支持对gltf模型使用draco批量压缩，减少模型体积。 Geobuilding会导出建筑物的gltf模型序列，并有每个模型的经纬度坐标，并给出模型浏览演示文件代码demo.html演示文件是基于Cesium展示。 视频演示【更新】大范围3D城市gltf模型制作，自动分割转模型，webGIS坐标对齐浏览，GIS数据转模型！_哔哩哔哩_bilibili
61510编辑于 2024-04-22
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号