Question

我试图平滑地旋转相机并且不改变相机方向的y矢量，我可以使用看，它会在闪光灯中改变相机方向，但这对我不起作用，我想随着相机方向的变化，平滑过渡。我一直在阅读，而不是理解一切，但在我看来，四元数是解决这个问题的方法。

我有this.object（我的相机）沿着设定路径移动（this.spline.points）。任何时候摄像机的位置都是（thisx，thisy，thisz）

我有cc [i]我希望相机面向的方向矢量（以前我使用的是lookat（cc [i]），它正确地改变方向，但太快/瞬间）

使用我已阅读过的信息，我在下面尝试了这个，结果导致相机移动时屏幕变黑。

有人可以解释我是否走在正确的轨道上，如何纠正我的代码。

由于

var thisx = this.object.matrixWorld.getPosition().x.toPrecision(3);
var thisy = this.object.matrixWorld.getPosition().y.toPrecision(3);
var thisz = this.object.matrixWorld.getPosition().z.toPrecision(3);
var i = 0;
do {
    var pathx = this.spline.points[i].x.toPrecision(3);
    var pathz = this.spline.points[i].z.toPrecision(3);

    if (thisx == pathx && thisz == pathz){

    this.object.useQuaternion = true;
    this.object.quaternion = new THREE.Quaternion(thisx, thisy, thisz, 1);
    var newvect;
    newvect.useQuaternion = true;
    newvect.quaternion = new THREE.Quaternion(thisx+cc[i].x, thisy+cc[i].y, thisz+cc[i].z, 1);

    var newQuaternion = new THREE.Quaternion();

    THREE.Quaternion.slerp(this.object.quaternion, newvect.quaternion, newQuaternion, 0.5);
    this.object.quaternion = newQuaternion;


     //this.object.lookAt( cc[i]);
            i = cc.length;
    } else i++;

} while(i < cc.length);

Answer 1

无需调用this.object.useQuaternion = true。这是默认行为。此外，this.object.quaternion包含当前的旋转，因此也不需要生成它。

您可能想尝试不同的方法 - 从样条位置，lookAt和向上矢量构建旋转矩阵，创建四元数路径作为预处理步骤：

var eye = this.spline.points[i].clone().normalize(); 
var center = cc[i].normalize();
var up = this.object.up.normalize();
var rotMatrix = new THREE.Matrix4().lookAt(eye, center, up);

然后，您可以从旋转矩阵创建四元数：

var quaternionAtSplineCoordinates = [];
quaternionAtSplineCoordinates.push(new THREE.Quaternion().setFromRotationMatrix(rotMatrix));

一旦有了这条路径，就可以在动画循环中将四元数应用到相机 - 前提是你有足够多的样本。否则，您可以考虑使用slerp生成中间点。

试图锻炼如何使用四元数来旋转沿着路径移动的相机以查看新的方向向量

1 个答案: