ThreeJS 将 GLTF 模型匹配到边界框的大小

Question

我想将导入的 GLB 模型缩放到场景中的立方体大小。需要确保模型位于阴影投射区域内并且足够大以使阴影可见。

我已经计算了两个对象的边界框：

// shadowcasting area 
var sceneExtent = new THREE.BoxGeometry( 4, 4, 4 );
var cube = new THREE.Mesh( sceneExtent, material );
var sceneBounds = sceneExtent.computeBoundingBox()

和

// imported mesh
model.traverse( function ( child ) {
    if ( child.isMesh ) {
        child.geometry.computeBoundingBox()
        meshBounds = child.geometry.boundingBox
    }
} );

但现在我不知道如何使用它们来修改 GLTF 模型的 scale

// meshBounds = child.geometry.boundingBox
// sceneBounds = sceneExtent.computeBoundingBox()

// how to resize model scale to match size of sceneBounds

model.scale.set(1,1,1)

我已经研究了很多，但我似乎不理解目前找到的解决方案。

如何修改模型比例以使 sceneBounds 与我掌握的信息匹配？

更新：要获取边界框，请改用 .setFromObject()：

sceneBounds = new THREE.Box3().setFromObject( cube );
meshBounds = new THREE.Box3().setFromObject( model );

Answer 1

例如像这样：

// Calculate side lengths of scene (cube) bounding box
let lengthSceneBounds = {
  x: Math.abs(sceneBounds.max.x - sceneBounds.min.x),
  y: Math.abs(sceneBounds.max.y - sceneBounds.min.y),
  z: Math.abs(sceneBounds.max.z - sceneBounds.min.z),
};

// Calculate side lengths of glb-model bounding box
let lengthMeshBounds = {
  x: Math.abs(meshBounds.max.x - meshBounds.min.x),
  y: Math.abs(meshBounds.max.y - meshBounds.min.y),
  z: Math.abs(meshBounds.max.z - meshBounds.min.z),
};

// Calculate length ratios
let lengthRatios = [
  (lengthSceneBounds.x / lengthMeshBounds.x),
  (lengthSceneBounds.y / lengthMeshBounds.y),
  (lengthSceneBounds.z / lengthMeshBounds.z),
];

// Select smallest ratio in order to contain the model within the scene
let minRatio = Math.min(...lengthRatios);

// If you need some padding on the sides
let padding = 0;
minRatio -= padding;

// Use smallest ratio to scale the model
model.scale.set(minRatio, minRatio, minRatio);

ThreeJS 将 GLTF 模型匹配到边界框的大小

ThreeJS Match GLTF Model To Size Of Bounding Box

javascript

scale

three.js