如何将正交相机转换为透视和背面?

时间:2015-06-11 17:53:29

标签: javascript camera three.js perspective orthographic

我正在使用combinedcamera.js和orbitcontrols.js https://github.com/mrdoob/three.js/blob/master/examples/js/cameras/CombinedCamera.js https://github.com/mrdoob/three.js/blob/master/examples/js/controls/OrbitControls.js

我让它工作,以便可以切换摄像机,并且两者都可以放大和缩小。 然而,轨道控制重新定位透视相机以模拟变焦,并且它不会使用正交相机(它改变fov等)。

这最终导致相机远视平面在透视模式下移动(我想要这个),并且它不会在正交模式下移动(我希望它移动)。

我通过使透视和正交相机重新定位来解决这个问题。正交相机不使用其位置来确定变焦,因此存在问题。

问题在于,当我在相机之间切换时,它们似乎没有相同的缩放量。

我想问题是,如何让正交相机依靠相机位置来确定变焦量,以便它总是看起来像透视相机一样具有相似的变焦效果?

1 个答案:

答案 0 :(得分:0)

好的,经过多次实验后,我发现了一种能够获得足够接近结果的hackish方法。 我意外地发现,如果将远视锥体值设置为25,它将完美地工作..所以我做了一个等式来补偿值是否不同。它足够接近,但也许有人可以看到它可以改进的地方?

我在combinedcamera.js中替换了

halfHeight /= this.zoom;
halfWidth /= this.zoom;

halfHeight /= ((this.cameraP.far/25)*this.zoom);
halfWidth /= ((this.cameraP.far/25)*this.zoom);

我在combinedcamera.js中添加了这一行

this.cameraO.far = this.cameraP.far+((this.cameraP.far/25)*this.zoom)-0.5;

在此之前

this.cameraO.updateProjectionMatrix();

这里是完整的部分

 THREE.CombinedCamera.prototype.toOrthographic = function () {

// Switches to the Orthographic camera estimating viewport from Perspective

var fov = this.fov;
var aspect = this.cameraP.aspect;
var near = this.cameraP.near;
var far = this.cameraP.far;

// The size that we set is the mid plane of the viewing frustum

var hyperfocus = ( near + far ) / 2;

var halfHeight = Math.tan( fov * Math.PI / 180 / 2 ) * hyperfocus;
var planeHeight = 2 * halfHeight;
var planeWidth = planeHeight * aspect;
var halfWidth = planeWidth / 2;

halfHeight /= ((this.cameraP.far/25)*this.zoom);
halfWidth /= ((this.cameraP.far/25)*this.zoom);

this.cameraO.left = -halfWidth;
this.cameraO.right = halfWidth;
this.cameraO.top = halfHeight;
this.cameraO.bottom = -halfHeight;

// this.cameraO.left = -farHalfWidth;
// this.cameraO.right = farHalfWidth;
// this.cameraO.top = farHalfHeight;
// this.cameraO.bottom = -farHalfHeight;

// this.cameraO.left = this.left / this.zoom;
// this.cameraO.right = this.right / this.zoom;
// this.cameraO.top = this.top / this.zoom;
// this.cameraO.bottom = this.bottom / this.zoom;

this.cameraO.far = this.cameraP.far+((this.cameraP.far/25)*this.zoom)-0.5;
this.cameraO.updateProjectionMatrix();

this.near = this.cameraO.near;
this.far = this.cameraO.far;
this.projectionMatrix = this.cameraO.projectionMatrix;

this.inPerspectiveMode = false;
this.inOrthographicMode = true;

 };

我也将this.zoom更改为1,用于透视相机

 THREE.CombinedCamera.prototype.toPerspective = function () {

// Switches to the Perspective Camera

this.near = this.cameraP.near;
this.far = this.cameraP.far;

this.cameraP.fov =  this.fov / 1 ;

this.cameraP.updateProjectionMatrix();

this.projectionMatrix = this.cameraP.projectionMatrix;

this.inPerspectiveMode = true;
this.inOrthographicMode = false;

 };

另外,我不得不调整轨道控制

this.dollyIn = function ( dollyScale ) {

    if ( dollyScale === undefined ) {

        dollyScale = getZoomScale();

    }

        scale /= dollyScale;
        scope.object.zoom = Math.max( this.minZoom, Math.min( this.maxZoom, this.object.zoom * dollyScale ) );
};

this.dollyOut = function ( dollyScale ) {

    if ( dollyScale === undefined ) {

        dollyScale = getZoomScale();

    }

        scale *= dollyScale;
        scope.object.zoom = Math.max( this.minZoom, Math.min( this.maxZoom, this.object.zoom / dollyScale ) );
};