如何讓相機在一個點上旋轉？

如何讓相機在一個點上旋轉？我開始做這個，但我有一些問題，當φ= 90度，-90度，並在旋轉我不滾相機這樣的方式如何讓相機在一個點上旋轉？

theta = - ((event.clientX - lastLeft) * 360 /window.innerWidth) + onMouseDownTheta; 
    phi = ((event.clientY - lastTop) * 360 /window.innerHeight) + onMouseDownPhi; 
    var cosPhi = Math.cos(phi * Math.PI/180); 
    var sinPhi = Math.sin(phi * Math.PI/180); 
    var sinTheta = Math.sin(theta * Math.PI/180); 
    var cosTheta = Math.cos(theta * Math.PI/180); 

    camera.position.x = - radious * sinTheta * cosPhi; 
    camera.position.y = radious * sinPhi; 
    camera.position.z = radious * cosTheta * cosPhi; 

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


    if(phi > 90){ 
    u = u*(-1);     
    camera.up = new THREE.Vector3(0, u, 0); 
    } 
    camera.updateMatrix();

來源

2012-08-02 Setaper

你的意思是說，在某些時候相機翻轉，但你希望你的旋轉更像這樣：http://braingl.de？ – Roest 2012-08-02 13:33:57

常見類型的相機控制已內置到three.js並且可以輕鬆實現。

很多的例子已經在使用這些控制接口，你可以利用它們自己的簡單，如：

var scene, renderer, camera, controls, clock; 

function init() { 
    scene = new THREE.Scene(); 
    renderer = new THREE.WebGLRenderer(); 
    renderer.setSize(WIDTH, HEIGHT); 
    document.body.appendChild(renderer.domElement); 

    camera = new THREE.PerspectiveCamera(VIEW_ANGLE, ASPECT_RATIO, NEAR, FAR); 
    controls = new THREE.TrackballControls(camera); 

    clock = new THREE.Clock(); 

    // ... (Scene setup) 

    requestAnimationFrame(update); 
} 

function update() { 
    requestAnimationFrame(update); 

    // Fetch the delta from THREE.js' clock. 
    var delta = clock.getDelta(); 
    // Pass it to the camera controller. 
    controls.update(delta); 

    renderer.render(); 
} 

// Load up the scene when the page finishes loading. 
// This can be done a few different ways, this one is 
// useful for script tags embedded in the <head> of the page. 
window.addEventListener('load', init, false);

或者，如果你願意，你可以看看在控制源代碼寫你自己的，看看內置控制器如何操縱相機： https://github.com/mrdoob/three.js/blob/master/examples/js/controls/TrackballControls.js

來源

2012-08-02 16:39:29 Nimphious

如何讓相機在一個點上旋轉？

回答

相關問題