Javascript 使用Three.js中的Orbit控件旋转相机时发生奇怪的抖动

Javascript 使用Three.js中的Orbit控件旋转相机时发生奇怪的抖动,javascript,camera,three.js,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.WebGLRender

我正在做一个太阳系的模型。这是我目前的衡量标准:

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

问题是对于小行星/卫星(我想出了解决方案

我的问题是在处理远离原点的对象时出现浮点精度错误。这是一个众所周知的问题,有多种解决方案。我使用了以下方法:


基本上,我们不是移动摄影机/播放器,而是相对于始终位于原点的摄影机/播放器变换整个场景。在这种情况下,动态观察控件的目标始终是原点。

请参见,不幸的是,缩小摄影机的近平面和远平面之间的范围没有帮助。我将“近”设置为0.01,“远”设置为1(因此范围仅为10^2)并且仍然会发生震动。