Threejs新版本后glb导出提示.x问题GLTFExporter,替代3dmax

一般会这么写 Export

javascript 复制代码
 const { GLTFExporter } = await import('three/examples/jsm/exporters/GLTFExporter.js');

如果你是网上,或者AI找的,左手倒右手的复制资料都会提示你这个问题

但我的问题,除了这句,几万行代码,本来是好的

好像是引入.vue,改了一点点框架, Threejs 引用了最新版本后就出事了;

THREE@1.63后,堆栈定位:_processNodeWithPivotAsync

复制代码
at GLTFWriter._processNodeWithPivotAsync (chunk‑GS642PJL.js:1410:33)
at GLTFWriter.processNodeAsync
at GLTFWriter.processSceneAsync

✅ 不是 geometry /attributes 的问题!是 Node(Object3D 节点层级)处理逻辑崩溃,新版 three 新增的 pivot 支点逻辑。

three.js 0.163+ 引入了 pivot(支点)支持 ,GLTFExporter 新增 _processNodeWithPivotAsync 分支来处理 obj.pivot。 这就是升级版本才出现这个 bug 的直接原因。 报错:读取某个对象的 .x,是读取 node.pivot.x,pivot 为 undefined。

根因

在旧版 three:Object3D 没有 .pivot 属 性 。 新版本:GLTFWriter 会无条件访问 node.pivot.x / pivot.y / pivot.z。 但是:

你代码解析 LOL 模型,手动构造 Object3D / Mesh,部分对象实例没有初始化 pivot 属性 (pivot = undefined)。 老版本代码不会碰 pivot,啥事没有;新版本走到 _processNodeWithPivotAsync,直接 undefined.x 崩溃。
注意:正常通过 new THREE.Object3D() 创建的对象会自带 pivot; 如果你是对象浅拷贝 / 自定义对象继承 / 手动组装对象树,会丢失 pivot 属性,pivot = undefined。


修复方案 A:导出前遍历整个树,给所有 Object3D 补全 pivot(最快)

在调用 exporter.parse() 之前执行 ,把树上所有节点补 pivot,如果不存在就新建 Vector3:

复制代码
target.traverse((obj) => {
  // 修复新版GLTFExporter _processNodeWithPivotAsync 读取 pivot.x 崩溃
  if (!obj.pivot) {
    obj.pivot = new THREE.Vector3(0, 0, 0);
  }
});

只需要这一段,再跑导出,这个栈的崩溃直接消失。

完整测试代码

javascript 复制代码
  const { GLTFExporter } = await import('three/examples/jsm/exporters/GLTFExporter.js');
  const exporter = new GLTFExporter();
  console.log(target);
  target.traverse(async obj=>{
    if(obj.isMesh){
      console.log('测试导出单个mesh:', obj.name);
      // try{
      //   await exportSingleMesh(obj);//不存在de 的方法,未测试通过
      //   console.log(obj.name, '✅ ok');
      // }catch(e){
      //   console.error(obj.name, '❌ crash', e.stack);
      // }
      // 修复新版GLTFExporter _processNodeWithPivotAsync 读取 pivot.x 崩溃
      if (!obj.pivot) {
        obj.pivot = new THREE.Vector3(0, 0, 0);
      }
    }
  })
  return new Promise((resolve, reject) => {
    exporter.parse(
      target,
      (result) => {
        const blob = new Blob([result], { type: 'model/gltf-binary' });
        downloadFn(blob, 'model_uv_modified.glb');
        console.log('导出完成: model_uv_modified.glb');
        resolve(blob);
      },
      (error) => {
        console.error('导出失败:', error);//已经会 打印错误堆栈
        reject(error);
      },
      {
        binary: true,
        //trs: false,//❗ `trs: false` 务必保证物体矩阵已经 updateMatrixWorld。
        trs: true,
        onlyVisible: true,
        maxTextureSize: 4096
      }
    );
  });

参考-3Dmax步骤和资料

这并不会从头开始说,什么是3Dmax?以前说不过搜索引擎,现在说不过AI

这也并不会从头建模,就是网上一抓一大把的,收集的LOL模型

目录

只显示一个View快捷键

模型居中快捷键

切换WireFrame

隐藏对象,只显示骨骼


只显示一个View快捷键

Alt + W

模型居中快捷键

Ctrl + Alt + Z

切换WireFrame

F3 or F4

但和常用的截图工具 Snipaste 冲突

所以一般,手动点击左上的 WireFrame,选择Default Shading

隐藏对象,只显示骨骼

选中,右键,-》【状态集】 上面的 【隐藏选定对象】

隐藏之后找回的方法(也是Hirerarchy)

快速选择对象(节点)

* 鼠标移动 到黄色点,看提示

max动画相关,课外阅读:

【小沐学Unity3d】3ds Max 骨骼动画制作(蒙皮修改器skin)_3dmax绑定骨骼蒙皮-CSDN博客

相关推荐
Code_Solitude9 小时前
c语言:二分法的完整补充
c语言·开发语言·算法
智鸟科技GemeOpen开发者智能设备9 小时前
MQTT智能通断器GSCW1M2P · 开发者实战指南
开发语言·物联网·智能家居
青柠之夏cc10 小时前
前端拖拽功能原生实现,不引入拖拽库完成业务
开发语言·前端·python
ym hyd 11110 小时前
题库建立与考试系统源码 Java+SpringBoot+Vue3 前后分离
java·开发语言·vue.js·spring boot·毕设
OKkankan10 小时前
Python 高阶语法(一):高阶函数、闭包、lambda 与 functools——从底层真正理解装饰器
开发语言·python
geovindu11 小时前
rust: Facade Pattern
开发语言·后端·设计模式·rust·外观模式
liangshanbo121511 小时前
前端大文件切片上传怎么做?
前端
福大大架构师每日一题11 小时前
Rust 1.99.0发布:C 可变参数、裸函数、Cargo 配置、Rustdoc 性能与大量兼容性调整全解析
c语言·开发语言·rust
智鸟科技GemeOpen开发者智能设备11 小时前
平安校园 AI 智能实时告警系统 智鸟科技·GemeOpen + 谷华科技·融合创新方案白皮书
java·开发语言·python·物联网·智能家居
Wang's Blog11 小时前
Java框架 SpringCloud 快速入门: Feign 的自定义配置与日志级别
java·开发语言·spring cloud