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