使用Or.js中的Orbit Controls旋转相机时发生奇怪的抖动

时间:2015-01-18 17:01:13

标签: javascript camera three.js

我正在制作太阳系的模型。这是我目前的指标:

scale = 0.001;
// 1 unit - 1 kilometer
var AU = 149597871 * scale;

这是我定义相机,渲染器和控件的方式:

camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.1 * scale, 0.1 * AU);
renderer = new THREE.WebGLRenderer({ alpha: true, antialias: true });
controls = new THREE.OrbitControls(camera, renderer.domElement);

然后我给用户提供在对象之间跳转的选项,这就是我在用户选择行星/月球后设置相机的方式:

function cameraGoTo() {
    for (var i = scene.children.length - 1; i >= 0 ; i--) {
        var obj = scene.children[i];
        if (obj.name == parameters.selected) {
            controls.target = obj.position;
            camera.position.copy(obj.position);
            camera.position.y += obj.radius * 2;
        }
    }
}

问题是对于小行星/卫星(半径<= 1000 km),相机在物体周围旋转时会摇晃。我只掌握计算机图形学的基本知识,所以我不知道这是轨道控制的问题,还是它与渲染器本身有关......所以我试图设置logarithmicDepthBuffer = true但是它没有帮助。尝试不同的scale并没有改变任何东西。

提前感谢任何帮助/线索。

编辑:

这里是小提琴: http://jsfiddle.net/twxyz/8kxcdkjj/

你可以看到随着以下任何一种情况发生震动:

  • 对象越小,
  • 来自原点的物体越远,

这是什么原因?它显然与相机近/远光谱值无关,但与物体距离场景中心的距离有关。

1 个答案:

答案 0 :(得分:1)

我提出了解决方案。

我的问题在于处理远离原点的对象时的浮点精度误差。这结果是一个非常已知的问题,并且存在各种解决方案。我使用过这个:

http://answers.unity3d.com/questions/54739/any-solution-for-extreamly-large-gameworlds-single.html

基本上不是移动相机/播放器,而是相对于始终位于原点的相机/播放器转换整个场景。在这种情况下,Orbit Controls&#39;目标始终是原点。