Hello to the OpenGL community!
I’m looking for some tips on 2D multi-layered refraction.
Currently, I’m able to produce the refraction effect perfectly for all refracted items that do not overlap. I’m also working with orthographic projection.
Here’s the rendering break-down:
- Render scene to texture.
- Render refraction displacement texture(s) (normal maps).
- Pass textures created in step 1 and step 2 to fragment shader to produce (fake) refraction results.
This method works quite well until the normal maps intersect and overlap. Here is a screen shot to illustrate the problem:
Image of the normal maps intersecting:
Image of the shaded result:
As you can see, the result does not emulate refraction of the background correctly because the normal maps intersect.
The only solution I could work out was to sort the normal maps and render each one to its own texture. Here’s my current thinking:
for each refraction object:
- Render current scene to texture.
- Render normal map to texture.
- Pass textures created in step 1 and step 2 to a shader for refraction .
The results are as desired. However, This seems like a terribly slow approach.
Could anyone please offer a better, more optimized, method of producing correctly layered 2D refraction?
Thanks in advance for getting to the end of this exhaustive post!