调整相机以匹配光线和屏幕点

Question

我正在为360度全景的自由视图工具工作，用三个。js。我希望相机旋转时，用户从屏幕拖动点离开点正好在鼠标指针下。

this.mesh = new THREE.Mesh(new THREE.BoxGeometry(2, 2, 2, 0, 0, 0),
    new THREE.MeshFaceMaterial(_array_of_THREE.MeshBasicMaterial_));
this.camera = new THREE.PerspectiveCamera(90, width / height, 0.1, 2);

null

adjustCamera: function(cameraDirection, worldRay, screenPoint){
        var angle;
        this.camera.lookAt(cameraDirection);
        this.raycaster.setFromCamera(screenPoint, this.camera);
        this.axis.copy(this.raycaster.ray.direction);
        angle = this.axis.angleTo(worldRay);
        this.axis.cross(worldRay).normalize();
        this.ray.copy(cameraDirection);
        this.ray.applyAxisAngle(this.axis, angle).normalize();
        this.camera.lookAt(this.ray);
    }

我意识到为什么这个模式不起作用。以这种方式改变相机方向会得到一些滚转（当旋转轴具有非零z坐标时），这被lookkat消除--它会消除滚转，只留下俯仰和偏航。这导致了一些不准确，当初始和最终射线更远，当初始相机位置有更高的俯仰时，它就会增长。我现在被困在这里，不知道如何在没有滚动的情况下计算摄像机的位置。

所以，问题是：我怎样才能准确地旋转相机，把特定的光线带到特定的屏幕点？（最好适合我使用的模式）

编辑：实际上可能有不止一个（似乎不超过两个，前提是光线不指向最低点或天顶）正确的相机位置（没有滚动），将世界光线投射到屏幕上的特定点。

在这种模棱两可的情况下，应选择最接近初始相机方向的选项。

Answer 1

为类似的全景目的解决这个问题需要相当长的时间。

这里的复杂之处在于如何从摄像机注视方向和向上向量来构造旋转矩阵，该向量固定了滚动方向。矩阵最终投射出规则的X、Y和Z轴，这样：

• Z匹配查找方向
• x与Z和向上向量垂直。
• y与X和Z垂直，以使两轴正交。

axisZ = direction;
axisX = normalize(cross(up, direction));
axisY = cross(direction, axisX);

您只需展开everything的所有项就可以得到视图的X、Y和Z分量的方程，并尝试提取Direction的分量。多亏了平方根，你得到了一个高次多项式系统，有3个方程和变量，几乎都是相互参照的。因为所有的轴都是正交的，所以可以使用z²=1-x²*y²来消除一个变量和方程，但是得到的两个多项式是四次的，都共享两个变量。我一开始是无法解决的，也是无意中尝试了一下：

w=M^-1_旋转v=M^T_旋转v

反转相机方向交换输入和输出，转置旋转矩阵使方程看起来完全不同。

(v_x*sqrt(1-d_y²-d_x2)-v_y*d_x-w_x-d_z*d_x)²*(1-d_y2)=0

现在，第一个是一个双二次方程，可以手工符号化地求解d_Y，相机的Y分量看方向。用Wolframα求解D_X的第二个问题，得到4个多项式，每个多项式约300项。定义一些辅助变量，然后产生一个合理的算法。它既不短也不快（不要把它放在顶点着色器中），但绝对能实现对鼠标移动做出直观反应的目的。我想出的启发式没有一个同样有效。

这是打字稿。

请注意，方向旋转天顶或天底点偏离YZ平面或位于XZ平面的错误一侧，根本不存在。这意味着用户不能完全任意地在屏幕上拖动点，除非你允许改变向上向量。