Three.js - 特定の軸を中心に球を回転する

Question

問題があります。 Three.jsでは、23.5度の軸を中心に球（地球）を回転させたいと思います。私はsphere.rotation.x、sphere.rotation.yとsphere.rotation.zを見つけましたが、それらを正しい比率で組み合わせると、球の回転は非常に奇妙です。回転軸は永久にありません。私はsphere.rotation.vector（1,0、-1）のような関数が必要だと思います。誰もこの関数がどのように呼び出され、正しい構文がどのようになっているか知っていますか？

回答ありがとう！

Answer 1

これにはquaternionsを使用する必要があります。 This videoは、クォータニオンが何であるか、そしてそれらが3Dグラフィックスでどのように使用されるかを説明します。

あなたはこのような四元数を構築することができます。

quaternion = new THREE.Quaternion().setFromAxisAngle(axisOfRotation, angleOfRotation); 

次に、あなたがして、オブジェクトに適用されます：あなたはまた、オブジェクト階層を使用することによって、これを達成することができます

object.rotation.setEulerFromQuaternion(quaternion); 

。たとえば、Object3D()のインスタンスを作成し、23.5度傾けて球（Earth）を作成し、それを傾斜したオブジェクトに追加することができます。球は、傾斜したY軸を中心に回転します。しかし、四元数はこれを解決するための最良のツールです。

Answer 2

オイラーアングルまたはクォータニオンがどのように機能するかを理解する必要はありません。あなたはaxisは単位ベクトル（長さ1を持っている）である、とangleはラジアンであることを確認し

Object3D.rotateOnAxis(axis, angle); 

を使用することができます。

Object3D.rotateOnAxis(axis, angle)オブジェクト空間の軸上で回転します。バージョンthree.js

three.js r.67

Answer 3

var quaternion = new THREE.Quaternion(); 
var object = scene.getObjectByName('xxx'); 
function render(){ 
    quaternion.setFromAxisAngle(new THREE.Vector3(0, 1, 0).normalize(), 0.005); 
    object.position.applyQuaternion(quaternion); 
} 

full example on codepenを参照してください、86です。