Render to cubemap

Hello Babylon community,

I would like to invoke a ShaderMaterial on a cubemap face. Is there an example how to do that?

I should mention that I’m quite new to Babylon, I have no experience with custom post processing pipelines.

So far I have been doing rendering into a texture the following way:

  • I created a ground mesh with very few vertices.
  • Im using a vertexshader which translates the uvs into a screen aligned quad.
  • I’m adding the ground to the renderList of the renderTexture.
  • I use renderTexture.setMaterialForRendering() for assigning the shader material to the ground.

I wonder if rendering to a specific cubemap face fits into this process somewhere.

Many thanks
Helmut

This is what we do in our prefiltering tech for environment texture: Babylon.js/hdrFiltering.ts at c599fb01de51ab3eba031c8d1d3c609351e8aa23 · BabylonJS/Babylon.js · GitHub

Basically you need to create a cube texture and bind the required face before rendering into it.

Hello sebavan,

thank you very much! Thats pretty much what I was looking for.

Basically I was missing this part:

        for (let face = 0; face < 6; face++) {
            effect.setVector3("up", directions[face][0]);
            effect.setVector3("right", directions[face][1]);
            effect.setVector3("front", directions[face][2]);

            for (let lod = 0; lod < mipmapsCount; lod++) {
                this._engine.bindFramebuffer(outputTexture, face, undefined, undefined, true, lod);
                this._effectRenderer.applyEffectWrapper(this._effectWrapper);

The only missing bit for me is the relations between BaseTexture, the InternalTexture and the ThinEngine, but I try to figure this out on my own first before I bother someone with that :slight_smile:

Thanks
Helmut

InternalTexture is a webgl/webgpu or native texture where several baseTexture can point from the same internalTexture from the cache (same url for instance). ThinEngine is the BabylonEngine in its smallest form allowing to use babylon as a hardware access layer without any 3d scenes and such.

I got it working ! Thank you sebavan, the code you pointed me to is actually a very good starting point - I can even reuse the direction vector calculation.
The only thing I couldn’t resolve yet is how to create a cubemap from the RenderTargetWrapper. At the moment I’m assigning the InternalTexture from the RenderTargetWrapper to an existing cubemap:

        emptyCubeMap._texture = this._rtCubemap.texture;
        //this._rtCubemap._swapAndDie(emptyCubeMap._texture);

In particular I don’t know if I create a memory leak this way.
But as I am doing this only once, I guess it shouldn’t be an issue.

1 Like