three.js POV摄像头看看周围的bug [英] three.js pov camera look around bug

问题描述

我用three.js创建了一个基本的场景。我的目标是让基于FirstPersonControls.js一个POV相机

I created a basic scene using three.js. My goal is to make a pov camera based on FirstPersonControls.js

我修改了code适合我的需要（移动鼠标点击视图等）我米几乎已经完成，但错误依然存在：当我移动相机上的第一次，它不会启动移动对象的位置，我正在寻找在现场负载。

I modified its code to fit my needs (moving view on mouse click, etc.) I m almost done but a bug remains: when I move the camera on the first time, it doesn't start moving from the object's position I m looking at on the scene load.

这只有当我设置了摄像机的位置发生。否则，它的几乎的作品，因为你可以在此链接上看到： http://jsfiddle.net/42qeojs0/

This only happens when I set a camera's position. Otherwise, it almost works, as you can see on this link: http://jsfiddle.net/42qeojs0/

只是取消注释这3行（第60行之后）

Just uncomment these 3 lines (after line 60)

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

然后，尝试通过拖动鼠标来移动物体的视图。你会看到你的拖动的起始位置是不一样的，你先看看位置。

Then, try to move the view around the object by dragging your mouse. You'll see the start position of your drag isn't the same as the position where you first look at.

在此先感谢

推荐答案

要更正初始跳的时候，你点击鼠标的左右你​​。引入新的变量 DIST 的对象的距离你看，并使用 ATAN2 为获得更可靠的方法经度。

To correct the initial jump around you get when you click the mouse. Introduce a new variable dist for the distance to the object your looking at and use atan2 as a more reliable way of getting the longitude.

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使用

In onDocumentMouseMove use

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 );

如果你把初始位置，计算纬度，长和DIST，然后计算看着矢量你得到你开始与什么这样。使用的效果500的固定倍数做出突然跳转到一个位置远于你开始。 （注Math.Hypot不支持IE浏览器，所以你可能需要在计算这个自己，如果针对IE浏览器）。

This way if you take the initial position, calculate lat, long and dist, and then calculate the looking at vector you get what you started with. Using a fixed multiple of 500 in effect made sudden jump to a position further away than you started. (Note Math.Hypot is not supported in IE so you might need the calculate this yourself if targeting IE).

这篇关于three.js POV摄像头看看周围的bug的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！