Javascript 调整摄像头以获得可见的Three.js形状

Javascript 调整摄像头以获得可见的Three.js形状,javascript,three.js,Javascript,Three.js,我有一个立方体测量仪,相机正看着它,我希望相机能变焦,使立方体完全可见,但不能变大 我最初的尝试是将立方体垂直转换为摄像机坐标系 function toScreenXY(position, camera) { var pos = position.clone(); var projScreenMat = new THREE.Matrix4(); projScreenMat.multiply(camera.projectionMatrix, camera.matrixWorldInve

我有一个立方体测量仪,相机正看着它,我希望相机能变焦,使立方体完全可见,但不能变大

我最初的尝试是将立方体垂直转换为摄像机坐标系

function toScreenXY(position, camera) {
  var pos = position.clone();
  var projScreenMat = new THREE.Matrix4();
  projScreenMat.multiply(camera.projectionMatrix, camera.matrixWorldInverse);
  projScreenMat.multiplyVector3( pos );

  return pos;
}
function ScaleInView() {
  camera.fov = 0.0;
  for (var i=0; i<8; i++) {
    proj2d = toScreenXY(cube.geometry.vertices[i],camera);
    angle = 57.296 * Math.max(Math.atan(proj2d.x/proj2d.z), Math.atan(proj2d.y/proj2d.z));
    camera.fov = Math.max(camera.fov,angle);
  }
  camera.updateProjectionMatrix();
}
屏幕功能(位置、摄像头){
var pos=position.clone();
var projScreenMat=new THREE.Matrix4();
projScreenMat.multiply(camera.projectionMatrix,camera.matrixWorldInverse);
项目CreenMat.MultiplyVector 3(pos);
返回pos;
}
函数ScaleInView(){
camera.fov=0.0;

对于(var i=0;i透视摄影机。如果摄影机居中并正面查看立方体,请定义

dist
=摄像机到立方体正面的距离(重要!)

高度
=立方体的高度

如果按如下方式设置摄影机的视野

fov = 2 * Math.atan( height / ( 2 * dist ) ) * ( 180 / Math.PI );
然后立方体高度将与可见高度匹配

正交摄影机。如果摄影机居中并正面查看立方体,请定义

纵横比
=窗口的纵横比(即宽度/高度)

高度
=立方体的高度

然后按以下方式构造相机:

camera = new THREE.OrthographicCamera( -aspect * height/2, aspect * height/2, height/2, -height/2, near, far );
立方体高度将与可见高度匹配

在这两种情况下,如果摄影机未居中,或者以其他方式以一定角度查看立方体,则问题更为复杂


此外,如果窗口比高窗口窄,则宽度是约束因素,问题更复杂。

乘以摄影机。matrixWorldInverse在摄影机坐标中提供向量,但重要的是不应用透视

function toCameraCoords(position) {
  return camera.matrixWorldInverse.multiplyVector3(position.clone());
}
然后,我们可以找到适合场景中所有长方体角的最小角度。arctan(D.x/D.z)给出角度BCD,其中B是摄影机正在查看的,C是摄影机的位置,D是希望在摄影机坐标中可见的对象的位置

在我的例子中,以下内容确保立方体边界框完全可见

function ScaleInView() {
  var tmp_fov = 0.0;

  for (var i=0; i<8; i++) {
    proj2d = toCameraCoords(boundbox.geometry.vertices[i]);

    angle = 114.59 * Math.max( // 2 * (Pi / 180)
      Math.abs(Math.atan(proj2d.x/proj2d.z) / camera.aspect),
      Math.abs(Math.atan(proj2d.y/proj2d.z))
    );
    tmp_fov = Math.max(tmp_fov, angle);
 }

 camera.fov = tmp_fov + 5; // An extra 5 degrees keeps all lines visible
 camera.updateProjectionMatrix();
}
函数ScaleInView(){
var tmp_fov=0.0;

对于(var i=0;iI在我最初的问题中应该更清楚。我试图做的是当相机围绕立方体旋转时自动放大或缩小。也就是说,当它以一个角度查看立方体时。我编辑了这个问题来澄清这一点。你将如何找到立方体的高度。这是通过计算边界框来实现的吗?我们将得到边界框摄像机初始化后的模型g框。