Dear all,
I am currently creating a solar system example with three.js, as many users have done. However, when I set up the size of the orbit in real scale and zoom in on small object (in the below jsfiddle, it is Ceres), the orbit is fluctuating. Is it caused by the precision of Float32Array of BufferGeomery or other reasons? Are there any solutions to resolve this issue or any tricks that can be used?
Thank you.
You will need to adjust depth buffer precision (camera.near, camera.far) if your application is using large changes in scale. Enabling the logarithmicDepthBuffer option on the renderer may also be worth a try.
if you use the real scale for the solar system you are probably running out of precision in the transformation matrix. try to change it so that the coordinates of the thing you look at is always next to 0,0,0 (and not, like 1e234,5e67,8e9)
Thank you for answering question.
Btw, I added jsfiddle link above.
As you can see, even though I set logarithmicDepthBuffer as True, the problem was not resolved:(
Aha, then I’ll modify OrbitControls so that its targetPoint is always (0,0,0) by translating all objects. I’ll try it, and let you know the result. Thank you!
@makc3d
I edited the code so that the origin of system translates to the position of a target object when I click the target object. Thus, if I select Ceres, the position of Ceres is zero (0,0,0).
//this.orbit_controls.target.copy(target_point);
this.solar_system.orbit.position.sub(target_point);
But, as you can see the above jsfiddle, there is shaking still 
for me ceres does not shake, but the orbit does, since its points are still centered at the sun, arent they 
instead, everything should be centered at the camera target. and this will be larger change than a single position.sub() call. also, you might want to look at this package
Oh, yes. You’re right. I mean the shaking of orbit. I moved the orbit using sub() so that the global position of targetpoint to be zero. But as you said, since the ellipse is created using THREE.EllipseCurve() function, thus its center is still the sun!
So I make a trick. I add a single line segment starting from zero in the scene, and change the endpoint of line along with the orbit.
In JSFiddle, I did not add a code to change the endpoint of line segment yet, but it would be work properly if I make the line segment of the existing orbit be transparent and add the above single line segment.