3

例に似た三人称カメラを作成したい。カメラとオブジェクトの回転差が大きすぎる場合 (おそらく 10% 以上)、カメラはオブジェクトの後ろにくっついて回転する必要があります。

これは私の実際のカメラコードです:

var targetPosition = this.getTargetPosition();
var targetRotation = this.getTargetRotation();
var tmpQuaternion = new THREE.Quaternion();
tmpQuaternion.setFromAxisAngle(new THREE.Vector3(0, 1, 0), 180 * (Math['PI'] / 180));
this.camera.quaternion = targetRotation;
this.camera.position = targetPosition;
this.camera.quaternion.multiplySelf(tmpQuaternion);
this.camera.quaternion.normalize();
this.camera.updateMatrix();
this.camera.translateZ(200);
this.camera.translateY(50);

しかし、現在いくつかの問題があります。カメラのクォータニオンをターゲットの回転に直接設定しないでください。しかし、カメラの四元数とターゲットの四元数の差を計算する方法がわかりません。距離が高すぎる場合は、おそらくこれを使用します。

var qm = new THREE.Quaternion();
THREE.Quaternion.slerp(targetRotation, this.camera.quaternion, qm, time);
this.camera.quaternion = qm;

2番目の問題は、ポジション自体です。現在、カメラの位置をオブジェクトの位置に設定し、それを翻訳して後ろに表示しますが、翻訳はすでにターゲット位置にある必要があり、カメラの位置はターゲット位置に変換する必要があります。

更新 1 : HTML の例を作成しました: http://ssachtleben.github.com/CameraProblem/

更新 2 : 私は今、いくつかの進歩を遂げました。この関数でクォータニオンの違いが得られるようです:

getAxisAngle = function(quaternion1, quaternion2) {
  var tmpQuaternion = new THREE.Quaternion();
  tmpQuaternion.setFromAxisAngle(new THREE.Vector3(0, 1, 0), 180 * (Math['PI'] / 180));
  var tmpRotation1 = quaternion1.clone();
  tmpRotation1.multiplySelf(tmpQuaternion);
  tmpRotation1.normalize();
  var tmpRotation2 = quaternion2.clone();
  if (tmpRotation2.w > 1) {
    tmpRotation2.normalize();
  }
  var angle1 = 2 * Math['acos'](tmpRotation1.w);
  var angle2 = 2 * Math['acos'](tmpRotation2.w);
  var diff = angle1 > angle2 ? angle1 - angle2 : angle2 - angle1;
  return diff;
};

ただし、角度の差が大きすぎる場合は、軸を固定する必要があることを知っておいてください。これどうやってするの？

どんな助けでも大歓迎です。

4

1 に答える 1