three.js - 如何在补间期间让相机看一个物体

所以我正在尝试使用补间来补间相机的fov，这是基于场景中点击的物体，这很好，但现在我想要它做的是让相机切换其焦点到被点击的对象，这是不工作的。这里是我的点击代码：three.js - 如何在补间期间让相机看一个物体

function onDocumentMouseDown(event) { 
    event.preventDefault(); 

    var vector = new THREE.Vector3((event.clientX/window.innerWidth) * 2 - 1, - (event.clientY/window.innerHeight) * 2 + 1, 0.5); 
    var ray = new THREE.Ray(camera.position, vector.subSelf(camera.position).normalize()); 
    var intersects = ray.intersectObjects(objects); 
    if (intersects.length > 0) { //We've clicked a certain object 

     camTarget = intersects[0].object.position; //HERE'S THE VECTOR3 I WANT TO LOOK AT 
     camTween.start(); 
    } 
}

和我对吐温/相机移动代码：

var camUpdate = function(){ 
    camera.fov = currentFov.fov; //WORKING 
    camera.lookAt(camTarget); //NOT WORKING 
    camera.updateProjectionMatrix(); 
} 

var currentFov = { fov: camera.fov }; 

TWEEN.removeAll(); 
camTween = new TWEEN.Tween(currentFov).to({fov: +zoomInFov},tweenTime).easing(camEase).onUpdate(camUpdate);

相机正确补间的视野，但它似乎指向同一个保持它始终指向的方向，而不是切换到lookAt命令中指定的“camTarget”向量。

来源

2012-05-04 mheavers

渲染器调用THREE.Camera.update（），默认情况下设置摄像头的旋转以查看THREE.Camera.target（这是THREE.Object3D）。而不是做的......

camera.lookAt(camTarget);

...尝试...

camera.target.position.copy(camTarget);

我不知道我跟着camTarget是如何补间，也许它只是应该切换到新的对象？注意：最好不要在事件处理程序中执行大量计算 - 在最好的世界中，您在事件处理程序中设置一个标志并在渲染循环中处理。

来源

2012-05-06 08:29:51 MikaelEmtinger

啊 - 是的，让它看看正确的位置的问题是，我把它放在事件处理程序，而不是动画循环。我能够使用lookAt（）而不是copy（）。很好的接收。至于如何修补，我不确定。我认为通过将它放入一个动画函数中，当相机移动它的fov时，lookAt函数也会动态变化，从某种意义上说，它看起来就像是补间一样。我想我可能不得不移动相机，而不是改变它的工作。不过谢谢。 – mheavers

很高兴你得到它的工作:) – MikaelEmtinger

@MikaelEmtinger - 为什么你不应该在事件处理程序中做太多？ – Neil

three.js - 如何在补间期间让相机看一个物体

回答

相关问题