Переместите камеру с помощью кватернионов и tween.js

#three.js

Вопрос:

Я хочу перемещать камеру с вращением из одной точки в другую (следуя поверхности сферы). Камера смотрит в центр одного объекта.

Я использую следующий код, который работает, но я не уверен, что он правильный.

   rotateCameraTo (cameraX, cameraY, cameraZ, time) {
    const camera = this._camera.camera;
    const initialCamera = new Vector3().copy(camera.position);

    const cameraVectorStart = new Vector3(camera.position.x, camera.position.y, camera.position.z);
    const cameraVectorEnd = new Vector3(cameraX, cameraY, cameraZ);
    cameraVectorStart.normalize();
    cameraVectorEnd.normalize();

    let qa = new Quaternion(0, 0, 0, 1);
    let qb = new Quaternion().setFromUnitVectors(cameraVectorStart, cameraVectorEnd);
    let qm = new Quaternion();

    let ti = { t: 0 };

    new TWEEN.Tween(ti)
      .to({ t: 1 }, time)
      .easing(TWEEN.Easing.Quadratic.InOut)
      .onUpdate(function () {
        camera.position.set(initialCamera.x, initialCamera.y, initialCamera.z);
        qm.slerpQuaternions(qa, qb, ti.t);
        camera.position.applyQuaternion(qm);
        //At the moment the object is centered in the origin
        camera.lookAt(0, 0, 0);
      })
      .onComplete(function () {
        window.cancelAnimationFrame(animationID);
      })
      .start();
  }
 

Вещи, которые я не знаю, правильны ли они:

  • Я устанавливаю камеру в исходное положение каждые .onUpdate().
  • Я использую let qa = новый кватернион(0, 0, 0, 1), потому что он работает, но я не уверен в этом.
  • Если есть лучшее решение, чем использовать кватернионы

Еще одно сомнение заключается в том, можно ли вместо этого получить другой путь, более короткий, из одной точки в другую. Это связано с тем, что я предпочитаю вращаться с Y в качестве оси вращения, но если я использую точки с разными значениями Y, это не работает.

Любые предложения будут высоко оценены!