javascript - three.js pov 相机环视错误

Question

我使用 three.js 创建了一个基本场景。我的目标是基于 FirstPersonControls.js 制作一个 pov 相机

我修改了它的代码以满足我的需要(点击鼠标移动 View 等)我快完成了，但是一个错误仍然存​​在:当我第一次移动相机时，它不会从对象的位置开始移动我正在查看场景负载。

这只会在我设置相机位置时发生。否则，它几乎 有效，如您在此链接中所见:http://jsfiddle.net/42qeojs0/

只需取消注释这 3 行(第 60 行之后)

    camera.position.x = 10;
    camera.position.y = 10;
    camera.position.z = 250;

然后，尝试通过拖动鼠标在对象周围移动 View 。您会发现拖动的开始位置与您第一次看到的位置不同。

提前致谢

Answer 1

修正单击鼠标时出现的初始跳跃。引入一个新变量 dist 来表示到您所看到的物体的距离，并使用 atan2 作为获取经度的更可靠方法。

dist = Math.hypot(blue1.position.x,blue1.position.y,blue1.position.z);
phi = Math.acos(blue1.position.y/dist);

theta = Math.atan2(blue1.position.z,blue1.position.x);

lon = THREE.Math.radToDeg(theta);
lat = 90-THREE.Math.radToDeg(phi);

在onDocumentMouseMove中使用

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

这样，如果您采用初始位置，计算纬度、经度和距离，然后计算观察向量，您就会得到开始时的结果。使用 500 的固定倍数实际上会突然跳到比你开始时更远的位置。 (请注意，IE 不支持 Math.Hypot，因此如果针对 IE，您可能需要自己计算)。