将Box3与ThreeJS中的模型一起旋转



我有以下问题。

有一个模型,通过setFromObject方法我得到Box3(截图-http://prntscr.com/12787py)。接下来,我旋转模型并获得一个新的Box3(屏幕截图-http://prntscr.com/12789fy)。

旋转模型后,是否有可能获得具有相同旋转的Box3,就好像Box3随模型旋转一样?

Box3是一个长方体的数学表示。因此,它仅用两个Vector3属性(maxmin(来表示,这两个属性表示长方体的两个相对角。这些值并不表示整个三维空间中的长方体,而是轴对齐的长方体。

看起来您正在使用BoundingBoxHelper。这将创建一个与世界对齐的线框。这意味着它将根据几何体顶点的变换位置来计算其形状,因此它可能会随着网格的旋转而改变形状。

若要创建与对象一起旋转的形状紧密的线框,需要直接从几何体创建一个,并确保对两个形状应用相同的变换。

// your shape
const shapeGeo = new BoxGeometry( 10, 10, 10 )
shapeGeo.computeBoundingBox() // <----------- DO THIS BEFORE ADDING IT TO THE SCENE!
const shapeMat = new MeshPhongMaterial( { color: 'red' } )
const shapeMsh = new Mesh( shapeGeo, shapeMat )
// your wireframe
const bboxMin = shapeGeo.boundingBox.min
const bboxMax = shapeGeo.boundingBox.max
const wireGeo = new BufferGeometry()
wireGeo.setAttribute( 'position' , new BufferAttribute( new Float32Array( [
  bboxMin.x, bboxMin.y, bboxMin.z,
  bboxMin.x, bboxMin.y, bboxMax.z,
  bboxMin.x, bboxMax.y, bboxMax.z,
  bboxMin.x, bboxMax.y, bboxMin.z,
  bboxMax.x, bboxMin.y, bboxMin.z,
  bboxMax.x, bboxMin.y, bboxMax.z,
  bboxMax.x, bboxMax.y, bboxMax.z,
  bboxMax.x, bboxMax.y, bboxMin.z,
] ), 3, false ) )
wireGeo.setIndex( new BufferAttribute( new Uint8Array( [
  0, 1, 1, 2, 2, 3, 3, 0,
  4, 5, 5, 6, 6, 7, 7, 4,
  0, 4, 1, 5, 2, 6, 3, 7
] ), 1, false ) )
const wireMat = new LineBasicMaterial( { color: 'yellow' } )
const wireBox = new LineSegments( wireGeo, wireMat )

现在,事情发生了一个看似奇怪的转折。一旦你有了你的接线盒,你可以简单地将其添加到你的形状中,未来对形状的更改将传递到你的接线箱:

scene.add( shapeMsh )
shapeMsh.add( wireBox )

这是因为转换被传递给子代*,而Mesh实际上只是Object3D的扩展,所以Mesh可以像任何其他Object3D导数一样有子代。

*只要你不禁用自动矩阵更新

最新更新