ThreeJS创建3D模型包围盒报错：Cannot read properties of undefined (reading 'updateWorldMatrix')

API 探路者

2026-7-1

解决ThreeJS创建模型包围盒的报错问题

错误根源

你代码里的mesh.asset是完全错误的写法——gltf.scene（也就是你赋值的mesh变量）根本没有asset属性，gltf.asset是GLTF文件的元数据（比如格式版本、生成工具信息），不是3D模型对象。Box3.setFromObject()需要传入ThreeJS的Object3D实例，你传了undefined，自然触发了读取updateWorldMatrix的报错。

修正方法

1. 正确计算包围盒（仅数据，不可视）

直接用加载后的模型根节点mesh来计算包围盒，这是获取模型包围盒数据的正确方式：

const loader = new GLTFLoader();
loader.load(
  modelsPath[0],
  (gltf) => {
    mesh = gltf.scene;
    mesh.visible = false;
    mesh.matrixAutoUpdate = false;
    scene.add(mesh);
    // 直接传入模型根节点计算包围盒
    box1 = new THREE.Box3().setFromObject(mesh);
    // 此时box1存储了包围盒的min/max坐标，但不能直接添加到场景
  },
  null,
  (error) => {
    console.log(error);
  }
);

2. 创建可视的包围盒（如果需要显示）

Box3只是一个存储坐标的数据对象，不能直接渲染。要在场景中显示包围盒，需要用Box3Helper生成可渲染的辅助线框：

const loader = new GLTFLoader();
loader.load(
  modelsPath[0],
  (gltf) => {
    mesh = gltf.scene;
    mesh.visible = false;
    mesh.matrixAutoUpdate = false;
    scene.add(mesh);
    
    // 计算包围盒
    const box1 = new THREE.Box3().setFromObject(mesh);
    // 创建红色包围盒辅助对象
    const boxHelper = new THREE.Box3Helper(box1, 0xff0000);
    // 将辅助对象添加到组中
    group.add(boxHelper);
  },
  null,
  (error) => {
    console.log(error);
  }
);