Wormhole renderer

I found this amazing video:

Does anyone would have any clue on how to reproduce a such “renderer” in Three.js?

1 Like

fairly easy but heavy way would be to render 2 scenes using CubeCamera-s and then just draw full-screen plane with a shader mixing them. as you can see, to get a decent resolution this method would require you to render 12 times more than a normal scene would need to. to get better performance and use normal cameras you would need to carefully track visible areas in both scenes, which kind of triples an effort math-wise (unless maybe you are willing to cut down on “lensing” effects)

@makc3d would you again do your magic with a quick drawing? It’s hard for me to figure it out…

Where do you position the 2 cubeCameras, and how do you exactly mix the renderTarget I guess?

Thank you

at exactly the same place but one in each of your 2 scenes. then you can have a typical fullscreen quad setup where you mix the pixels from the resulting two cube maps in the shader depending on how close you are to the wormhole.

you literally just mix them: mix(textureCube(map1, ray), textureCube(map2, ray), ratio); -where ray is your final camera 3D ray shooting through particular pixel

now the way you construct the ray is totally up to you, though, you can just emulate PerspectiveCamera or add some curvature to make it nicer, or you can even do it in physically nearly-accurate way as they did for Interstellar movie.

edit: another way would be to just cheat and look it up at github :smiley:

1 Like