三.JS - 补间相机位置

如何解决三.JS - 补间相机位置

我正在尝试实现双击将相机移动到场景中的那个位置，而不改变方向。

直播：https://cs12students.dce.harvard.edu/~amarkham/sandbox/

如果我不改变相机的初始位置似乎可以正常工作。如果我围绕场景旋转然后尝试，它会在移动结束时恢复到某种先前的状态。我觉得我错过了一些简单的东西，但我在这里！

//move to location on click
window.addEventListener('dblclick',function(event) {
  initRaycaster();
  const ground = findIntersection(groundplane);
 
  var startPos = camera.position;
  var startCtrl = controls.target;

  var targetX = ground[0].point.x;
  var targetY = ground[0].point.y;
  var targetZ = ground[0].point.z;
  var targetPos = {
    x: targetX,y: targetY + 200,z: targetZ
  };

  var targetCtrl = {
    x: targetX,y: targetY,z: targetZ
  };

  disableOrbitControls();
  var tweenPosition = new TWEEN.Tween(startPos).to(targetPos,1500).easing(TWEEN.Easing.Exponential.Out).start();
  var tweenRotation = new TWEEN.Tween(startCtrl).to(targetCtrl,1500).easing(TWEEN.Easing.Exponential.Out).start();
  enableOrbitControls();
});

function init() {
  //setting up scene...

  camera = new THREE.PerspectiveCamera(45,window.innerWidth / window.innerHeight,1,3000);
  setCamera(camera,scene);

  //...setting up scene...

  controls = new THREE.OrbitControls(camera,renderer.domElement); 
  setControls(controls);
  
  //...setting up scene
}
init();
animationFrame(renderer,scene,camera,controls,dragControls);

function animationFrame(renderer,dragControls) {
  renderer.render(scene,camera);
  TWEEN.update();
  controls.update();
  requestAnimationFrame(function() {
    animationFrame(renderer,dragControls);
  })
}

function setCamera(camera,scene) {
  camera.position.set(0,200,0);
  //camera.lookAt(scene.position);
}

function resetCamera() {
  controls.reset();
}

function setControls(controls) {
  controls.enabledamping = true;
  controls.dampingFactor = 0.1;
  controls.maxPolarangle = Math.PI * 0.3;
  controls.minPolarangle = Math.PI * 0.2;
  controls.mindistance = 50;
  controls.maxdistance = 500;
  controls.screenSpacePanning = false;
  //controls.saveState();
}

function initRaycaster() {
  event.preventDefault();
  mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
  mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;
  mouse.z = 1;
  raycaster.setFromCamera(mouse,camera);
}

function findIntersection(obj) {
  return raycaster.intersectObject(obj,true);
}