Javascript 3.js吐温照相机，看

我正在尝试使用tween.js将camera.lookAt转换为Three.js，但收效甚微

这很有效

    selectedHotspot = object;

    var tween = new TWEEN.Tween(camera.lookAt( object.position),600).start();

但将相机直接旋转到object.position

如何获得一个平滑的旋转

这是渲染函数

  function update() {

    lat = Math.max(-85, Math.min(85, lat));
    phi = THREE.Math.degToRad(90 - lat);
    theta = THREE.Math.degToRad(lon);

    target.x = 512 * Math.sin(phi) * Math.cos(theta);
    target.y = 512 * Math.cos(phi);
    target.z = 512 * Math.sin(phi) * Math.sin(theta);


    if(!selectedHotspot)
        camera.lookAt(target);


    renderer.render(scene, camera);

}

更新

---

好吧，我真的不能在任何东西上看到摄像机。我想一定是出了什么事。渲染函数中是否应该有其他内容

我认为您的代码应该如下所示：

// backup original rotation
var startRotation = new THREE.Euler().copy( camera.rotation );

// final rotation (with lookAt)
camera.lookAt( object.position );
var endRotation = new THREE.Euler().copy( camera.rotation );

// revert to original rotation
camera.rotation.copy( startRotation );

// Tween
new TWEEN.Tween( camera ).to( { rotation: endRotation }, 600 ).start();

对于位置二人组（但你知道要点），我使用的代码确实有一个持续时间参数，并且可以平稳地移动相机：

function setupTween (position, target, duration)
{
    TWEEN.removeAll();    // remove previous tweens if needed

    new TWEEN.Tween (position)
        .to (target, duration)
        .easing (TWEEN.Easing.Bounce.InOut)
        .onUpdate (
            function() {
                // copy incoming position into capera position
                camera.position.copy (position);
            })
        .start();
}

我这样称呼它：

setupTween (camera.position.clone(), new THREE.Vector3 (x, y, z), 7500);

获得7.5秒的平滑过渡。

谢谢大家

我放弃了试着在相机之间穿插，而是加入了

if (target.y < selectedHotspot.position.y - 2)
        lat += 0.1;
    else if (target.y > selectedHotspot.position.y + 2)
            lat -= 0.1; 

    if (target.x < selectedHotspot.position.x - 5)
        lon += 0.5;
    else if (target.x > selectedHotspot.position.x + 5)
        lon -= 0.5;
    else {

        camera.lookAt(selectedHotspot.position);

        if (camera.fov > selectedHotspot.bubble.distance*0.05){
            camera.fov -= 0.1;

        }
        if(sceneReady)
            loadScene();
    }

    camera.updateProjectionMatrix();

if（target.yselectedHotspot.position.y+2）
lat-=0.1；
if（target.xselectedHotspot.position.x+5）
lon-=0.5；
否则{
摄像头。注视（选择热点。位置）；
如果（camera.fov>selectedHotspot.bubble.distance*0.05）{
摄像机视场-=0.1；
}
如果（场景日）
loadScene（）；
}
camera.updateProjectMatrix（）；

---

到渲染循环中调用的函数。这很有效

我使用controls.target在摄影机的旋转之间切换，效果很好

createjs.Tween.get(controls.target)
.to({
  x: tweenPos.x,
  y: tweenPos.y - 11,
  z: tweenPos.z + 0.001
}, 800,createjs.Ease.linear);

---

Doob先生答案的四元数版本

// backup original rotation
var startRotation = camera.quaternion.clone();

// final rotation (with lookAt)
camera.lookAt( lookAt );
var endRotation = camera.quaternion.clone();

// revert to original rotation
camera.quaternion.copy( startRotation );

// Tween
var lookAtTween = new TWEEN.Tween( camera.quaternion ).to( endRotation, 600 ).start();

---

非常感谢。它仍然在那里直行，没有好的吐温。有什么想法吗？应该是

new TWEEN.TWEEN（camera.rotation）.to（{x:endRotation.x，y:endRotation.y，z:endRotation.z}，500）。start（）

现在开始吗？你没有在任何地方连接更新方法吗？它之所以“起作用”是因为它只会将camera.lookAt（…）设置到结束位置，在three.js 0.98上运行得非常好。