将相机聚焦在Three.js中的物体中心

Question

我正在使用三个.js中的ColladaLoader加载和对象,所以我在场景中有一堆对象.其中一些是常规形状,如:立方体,球体等,对于这些,我可以这样做:

var position = { 
  x: selectedObject.position.x, 
  y: selectedObject.position.y, 
  z: selectedObject.position.z 
};

controls.target = new THREE.Vector3(position);

其中控件是相机的OrbitControls.相机在该位置居中并且工作正常,问题是当对象不是常规形状,而是由顶点生成的几何.在这种情况下,我已经尝试了4种不同的方法而没有预期的结果.

1.

var position = { 
  x: selectedObject.matrixWorld.getPosition().x, 
  y: selectedObject.matrixWorld.getPosition().y, 
  z: selectedObject.matrixWorld.getPosition().z 
};

2.

var centerX = selectedObject.geometry.boundingSphere.center.x;
var centerY = selectedObject.geometry.boundingSphere.center.y;
var centerZ = selectedObject.geometry.boundingSphere.center.z;

var position = { x: centerX, y: centerY, z: centerZ };

3.

getCentroid(selectedObject.geometry.vertices);

function getCentroid(vertices) {
  var x = y = z = 0;
  vertices.forEach(function (element, index, array) {
    x += element.x;
    y += element.y;
    z += element.z;
  });

  return new THREE.Vector3(
    x / (vertices.length),
    y / (vertices.length),
    z / (vertices.length)
  );
}

4.

var position = getCenter(
  getMaxnMinCenter(selectedObject.geometry.vertices), 
  selectedObject.matrixWorld
);


function getMaxnMinCenter(vertices) {
  var maxX = maxY = maxZ = vertices[0];
  var minX = minY = minZ = vertices[0];

  vertices.forEach(function (element, index, array) {
    if (element.x <= minX.x) {
      minX = element;
    }
    if (element.y <= minY.y) {
      minY = element;
    }
    if (element.z <= minZ.z) {
      minZ = element;
    }
    if (element.x > maxX.x) {
      maxX = element;
    }
    if (element.y > maxY.y) {
      maxY = element;
    }
    if (element.z > maxZ.z) {
      minZ = element;
    }
  });

  return {
    minimumX: minX,
    minimumY: minY,
    minimumZ: minZ,
    maximumX: maxX,
    maximumY: maxY,
    maximumZ: maxZ,
  }
}

重要的是要注意常规形状使用1.0的标度,而其他对象使用0.005的标度.

谢谢.

Answer 1

var bb = new THREE.Box3()
bb.setFromObject(selectedObject);
bb.center(controls.target);

使用边界框来查找对象的中心