Three.js TranslateX或Y會導致旋轉，但我只是希望它沿着軸線直線移動

Question

我使用Three.js和TrackballControls來創建3D場景。

我創建了一個新的PerspectiveCamera

camera = new THREE.PerspectiveCamera(40, window.innerWidth/window.innerHeight, 1, 10000); 

我添加了幾個按鈕放大，縮小，左，右等..這裏是放大這是工作好代碼：

var button = document.getElementById('ctrlin'); 
button.addEventListener('click', function (event) { 

    camera.translateZ(-100); 

}, false); 

但是，當我嘗試「camera.translateY」或「camera.translateX」我的相機旋轉。

我只是想讓它沿着直線移動。

我意識到這可能與鎖定萬向節設置有關，但我不確定如何解決這個問題。

移動物體或相機會更好嗎？我如何做直線X或Y軸？

Answer 1

如果沿X軸移動攝像機，則還必須將攝像機的目標沿着X軸移動相同的距離，否則它會旋轉，因爲它會繼續查看相同的點。

看看能否幫助你解決問題。

另一種解決方案可以是將攝像機和目標都添加到容器中的對象，並開始移動所述對象周圍:)

編輯：

最後溶液包括可以是一個例子發現in this answer on StackOverflow