イントロダクション-次元変換-
Three.jsは、3D変換を、コード化するために、行列を使用します。
変換位置、回転、そして、機能拡張していく。
全てのObject3Dのインスタンスは、物体の位置や、回転そして、規模を保持している行列を持っている。
このページは、どのようにオブジェクトの変換をアップデートしていくのかについて描写していく。
便利な特性と、matrixAutoUpdate
物体の変換のアップデートのためには、二つの方法がある。
物体の位置、4元数、そして規模の特性を、修正し、それらの特性から、物体の行列をthree.jsに再計算
させます。
object.position.copy(start_position);
object.quaternion.copy(quaternion);
規定では、matrixAutoUpdateの特性は trueにセットされていて、
行列は、自動的に再計算されます。
もし、物体が静的なら、再計算が起こった時、主導でコントロールしたいのなら、
よりよいパフォーマンスは、特性をfalseにしたら得られる。
object.matrixAutoUpdate = false;
そして、多くの特性を変えた後、 行列は、アップデートされます。
object.updateMatrix();
物体の行列を直接修正する。Matrix4クラスは、行列を修正するための様々なメソッドを
持っています。
object.matrix.setRotationFromQuaternion(quaternion); object.matrix.setPosition(start_position); object.matrixAutoUpdate = false;
matrixAutoUpdateは、このケースでは、falseにセットされていて、必ずしもmatrixAutoUpdateを呼び出す必要はないってことに、注意してください。
updateMatrixを呼び出すことが、行列や、位置からの再計算、規模やその他へ作られる変化
手動での変化をなくします。
物体と、WorldMatrix
物体の行列は、物体のparentとの関係性への物体の変化を蓄えています。
世界の同等での物体の変化を得るために、物体のObject3D.matrixWorld.にアクセスする
必要があります。
parentかchild objectの転換が変わる時、childオブジェクトのupdateMatrixWorld()を呼んだことによってアップデートされたmatrixworldを呼ぶ事ができます。
Rotationと、Quaternion
Three.js は、3D回転を再表現することの2つの方法を提供してくれます。
二つの間で、転換するための方法と同等の オイラー角と、Quaternions。オイラー角と、gimbal lockと呼ばれる。そこでは、ある配置では、自由の度合いを失います。
(物体が一つの軸でしか回転しなくなることを防ぐ)
この理由によって、物体の回転は、常に4元数に保存されます。
