Strange shaking while rotating the camera with Orbit Controls in Three.js

问题

I'm making a model of the Solar System. This is my current metric:

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

This is how i define the camera, renderer and controls:

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

Then i give the user the option to jump between the objects so this is how i set the camera after user selects a planet/moon:

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

The problem is that for small planets/moons ( <= 1000 km in radius) camera is shaking while rotating around the object. I have only basic knowledge of computer graphics so i don't know either this is the problem of Orbit Controls or it has something to with renderer itself...so I've tried to set logarithmicDepthBuffer = true but it didn't help. Also trying different scale didn't change anything.

Thank in advance for any help/clues.

EDIT:

Here's the fiddle: http://jsfiddle.net/twxyz/8kxcdkjj/

You can see that shaking increases with any of the following:

the smaller the object,
the further the object from the point of origin,

What is the cause of this? It clearly seems it has nothing to do with the camera near/far spectrum values but is related to the distance the objects are from the center of the scene.

回答1:

I've come up with the solution.

My problem was with the floating point precision errors when dealing with objects far from the point of origin. This turns out to be a very known problem and there are various solutions. I've used this one:

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

What happens is basically instead of moving the camera/player, we transform whole scene relative to the camera/player that is always at the point of origin. In this case, Orbit Controls' target is always point of origin.

来源：https://stackoverflow.com/questions/28012352/strange-shaking-while-rotating-the-camera-with-orbit-controls-in-three-js

标签

javascript

camera

three.js