6

I've got a scene where I'm drawing(to scale) the earth, moon, and some spacecraft. When the moon is occluded by the earth, instead of disappearing, it is still visible (through the earth).

From my research I found that part of the problem is that the near settings for my camera were much too small, as detailed in the article linked, small values of near cause rounding in z-sorting to get fuddled for very distant objects.

The complexity here is that I need to have fine grain z-indexes for when the camera is zoomed in, to look at a spacecraft (an object with a radius of 61 meters at most, in comparison to the earth, weighing in at r =~ 6.5e+06 meters). In order to make objects on the scale of the moon and earth to render in the correct order, the near has to be at least 100,000 m at which point I cannot look at close objects.

One solution would be to reduce the scale to use kilometers, but I cannot afford to lose that precision, and prefer to use meters.

Any ideas as to how to make very large, distant objects render at the correct z Indices, while retaining scale and ability to zoom into small objects?

My Ideas (which I don't know how to implement):

  • Change z-buffer to include more values, and higher resolution?
  • Add distant objects to a "farScene" which is rendered using a "farCamera" which is controlled by the same controls used on a close-up camera?
Community
  • 1
  • 1
Boogiechillin
  • 276
  • 3
  • 19
  • 3
    Have a look at [this three.js demo](http://threejs.org/examples/webgl_camera_logarithmicdepthbuffer.html) which uses a logarithmic depth buffer. – WestLangley Jun 29 '15 at 18:53
  • That's friggin cool! This should work nicely. – Boogiechillin Jun 29 '15 at 19:30
  • I do it like this: [Solar system simulation vifth view 0.1m-1000AU + zoom up to 1000x](http://stackoverflow.com/a/28020934/2521214) the main idea is to render/combine 3 frustrum znear/zfar ranges – Spektre Jun 30 '15 at 06:09

2 Answers2

6

As per @WestLangley 's answer, the solution is simply to add the optionlogarithmicDepthBuffer: true to the renderer:

this.renderer = new THREE.WebGLRenderer({antialias: true, logarithmicDepthBuffer: true});
Boogiechillin
  • 276
  • 3
  • 19
0

Probably that the problem is z-test and not z-precision. this mean: z-test not apply (perhaps because that you render transparent object with alpha blending) or z-test apply with non default testing (e.g. override far instead near).

Try to render the whole scene with simple shader with no transparency in-order to make sure that transparency is not the source of the bug. to solve the z-order without z-test you should sort the object yourself each frame to determine the order of rendering (from far to close).

meirm
  • 1,241
  • 14
  • 21
  • Thanks for your answer, I am not using transparency. From what I've read, there are problems with overriding z-test, because there's a possibility covering near objects with far ones. Also, can you clarify how I would sort the objects myself? Perhaps use distanceTo() from the camera's position to all the other objects in the scene and give indexes? – Boogiechillin Jun 29 '15 at 19:28
  • 1
    It turns out apparently that three.js is not supported z functions other than default lessequal z-function, Although the WebGL has more possibilities. in WebGL you can set it with gl.DepthFunc(func) where func is one of the values from https://www.opengl.org/sdk/docs/man/docbook4/xhtml/glDepthFunc.xml Before you deeps into sorting the objects, you should verify that this is the problem. make sure that 1. you render all the objects via the same Three.Scene object. 2. traverse on your objects and apply same simple shader to all object. – meirm Jun 30 '15 at 14:42