javascript/threejs - 中心のy軸（3D空間内）の円内のオブジェクトを移動する方程式

Question

私はthreeJSを試しています。カメラの位置を決めて、シーンの原点を見ています、0,0）。私は、原点に焦点を当てながら、設定された距離（半径）でy軸の周りにそのカメラを周りに移動したいですが、私は方程式を設定する方法がわかりません。現在、私はオブジェクト自体を回転させていますが、代わりにカメラを回転させたいと思います。ここでメッシュを移動するための私のコードは次のとおりです。

function checkRotation(){ 
    if (keyboard.pressed("left")){ 
     mesh.rotation.y += .05; 
    } 

    if (keyboard.pressed("right")){ 
     mesh.rotation.y -= .05; 
    } 
} 

、ここでは、カメラを移動させる例のいくつかの並べ替えのようになります。

camera.position.x = ??? （xの位置を移動する式） camera.position.z = ??? （いくつかの方程式のz位置を移動する） camera.lookAt（mesh.position）;

あなたが提供できるヘルプは素晴らしいものです。ありがとう！

Answer 1

次のラインに沿って手動でカメラの位置を設定することができる：

// let theta be the amount you want to rotate by 
var x = camera.position.x; 
var z = camera.position.z; 

camera.position.x = x * Math.cos(theta) + z * Math.sin(theta); 
camera.position.z = z * Math.cos(theta) - x * Math.sin(theta); 
camera.lookAt(mesh.position); // or camera.lookAt(0, 0, 0); 

は、x、y、z軸周りの回転のためのマトリックスと同等のためhttp://en.wikipedia.org/wiki/Rotation_matrix#In_three_dimensionsを参照してください。

また、マウスではなくキーボードを使用するようにTrackballControlsを調整することもできます。

デフォルトのトラックボールの挙動：http://mrdoob.github.com/three.js/examples/misc_camera_trackball.html

注：私はまだこれをテストしていない - 私は仕事でね。

Answer 2

最近の返事のビットですが、Three.js（examples/js/controls内）に付属のOrbitControlsを見てみたい人もいます。 autoRotateに設定することができます。それはあなたのための数学の世話をするでしょう。ユーザーがカメラの位置を自分で制御できるようにしたくない場合は、あなたのrequestAnimationFrameの-と呼ばれる更新機能で次に

var controls = new THREE.OrbitControls(camera); 
controls.autoRotate = true; 
controls.autoRotateSpeed = [whatever speed you want] 

camera.lookAt(new THREE.Vector3(0,0,0)); 

...

controls.update(); 

、私はあなたが見つけることができると確信していますそれを無効にする方法、または必要なコードを抽出するだけです...