javascript - 设置目标后如何重新启动 Orbit Controls

Question

我在鼠标点击事件上为我的 THREE.OrbitControls 设置了一个新目标，效果很好。但是当相机平移到新位置后，我失去了与鼠标的所有交互。我正在用工作代码更新这个问题。

我认为当我将相机 z 和目标 z 设置为相同值时，我破坏了控件。

损坏的代码在这里: http://www.kreativperspektiv.com/pb2/chartlock.html

工作代码在这里: http://www.kreativperspektiv.com/pb2/chartcorrect.html

全景相机(500,200,4000,1000);

        var xTarget=0;
        var yTarget=0;
        var zTarget=0;
        var tweenDuration=0;

        function panCam(xTarget,yTarget,zTarget,tweenDuration){

          TWEEN.removeAll();

          var camNewPosition= { x : xTarget, y : yTarget, z : zTarget};
          var targetNewPos = {x : xTarget, y : yTarget, z : 0};

          var camTween = new TWEEN.Tween(camera.position).to(camNewPosition, tweenDuration).easing(TWEEN.Easing.Quadratic.InOut).start();
          var targetTween = new TWEEN.Tween(controls.target).to(targetNewPos, tweenDuration).easing(TWEEN.Easing.Quadratic.InOut).start();
    }

Answer 1

您不能像这样更新目标:

controls.target = newTarget;

这会破坏你的控制。
相反，必须使用 setter 方法或复制方法设置目标:

controls.target.copy( newTarget );
controls.target.set( x, y, z ) // where x, y and z are the new values

<小时/>

UDP日期

如果你想使用 TWEEN，只需尝试如下:

new TWEEN.Tween(camera.position).to(newPosition, tweenDuration);
new TWEEN.Tween(controls.target).to(newTarget, tweenDuration);