javascript/threejs - 圍繞中心y軸（在3D空間中）圍繞一個圓移動對象的方程

我正在試驗threeJS，並且我已經定位了一個相機並查看了一個場景的原點（0 ，0,0）。我想將攝像機圍繞y軸以設定的距離（半徑）圍繞一圈移動，同時保持對原點的關注，但我不確定如何設置方程。目前，我只是旋轉對象本身，但我想要旋轉相機。這裏是我的代碼，移動網：javascript/threejs - 圍繞中心y軸（在3D空間中）圍繞一個圓移動對象的方程

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）;

任何幫助，你可以提供將是偉大的。謝謝！

來源

2012-04-26 mheavers

我不知道JavaScript或threeJS，但方程很簡單：x'= cos（t）x - sin（t）y ，y'= sin（t）x + cos（t）y。 – Beta 2012-04-26 21:59:10

是的 - 我想我正在努力的是時間問題。我需要根據以前的x和z值來增加，而不是時間的函數。我有一些工作要說： – mheavers 2012-04-26 22:42:31

timer = Date.now（）* 0.0005; camera.position.x =（（Math.cos（timer）* 5）* 5）; camera.position.z =（（Math.sin（timer）* 5）* 5）; - 但這意味着如果他們停止按下按鈕，下一次他們擊中它時會跳轉 – mheavers 2012-04-26 22:42:55

可以大致如下手動設置相機的位置：

// 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

注：我沒有測試過這還沒有 - 我在工作。

來源

2012-04-26 22:40:59

我相信對threejs的一個新變化是你必須在相機統計信息更新之前調用'lookat'。對於他的用例，我猜它總是看着0,0,0。 – david 2012-04-26 22:52:56

啊，歡呼聲。更新。 – 2012-04-26 22:56:35

不錯，謝謝！ – mheavers 2012-04-27 14:39:10

比較晚的答案，但其他人可能希望看看Three.js附帶的OrbitControls（在examples/js/controls中）。您可以將其設置爲autoRotate。它會照顧你的數學。

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

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

在requestAnimationFrame所謂的更新功能

則...

controls.update();

如果你不希望用戶能夠控制攝像機的位置自己，我相信你能找到一種方法來禁用它，或者只是提取您需要的代碼...

來源

2013-01-19 19:03:58 poshaughnessy

javascript/threejs - 圍繞中心y軸（在3D空間中）圍繞一個圓移動對象的方程

回答

相關問題