three.js‎ > ‎

ロテーションについて


Three.jsでRotaion(ロテーション)を扱う場合、3つのクラスを使うと思います。

1つはVector3,2つめはMatrix4,3つめは Quaternionです。

ベクター(Vector3)

オイラー角と呼ばれるものです。別途 XYZの順番が必要になります。Three.jsのデフォルトではXYZです。
BVHモーションもオイラー角で角度を表しています。

順番を変更する場合、Object3D.eulerOrder に新しいオーダーを入れます。
オーダーを入れ替えた値を取るメソッドは用意されていません。

Vector3からMatrix4に変換
Matrix4には、setRotationFromEuler(Vector3,order)がありますので、これを使います。

Vector3からQuaternionに変換
Quaternion.setFromEuler(Vector3) を使います。

マトリックス(Matrix4)

加算とかが楽な形式、ポジションもっていろいろ便利

Matrix4からオイラー角に変換
Vector3のsetRotationFromMatrix(Matrix4)を使います。
(ジンバルロックの影響?かなにかで、90度超えてると変なことがあります。)

Matrix4からQuaternionに変換
Quaternion.setFromRotationMatrix(Matrix)を使います

クォータニオン(Quaternion)

中間の回転を表すのが得意です。

Quaternionからオイラー角に変換
直接変換する方法はありません。Matrix4に変換します。ただし、Object3Dには、オイラー角の代わりにQuaternionで角度を指定することができます。

QuaternionからMatrix4に変換 
Matrix4のsetRotationFromQuaternion(Quaternion)を使います。

Comments