PlaneGeometry with alphaToCoverage lacks transparency when rendered with CubeCamera

[lambocorp]

Description

I use MeshStandardMaterial with alphaToCoverage for transparency on a PlaneGeometry, I render the scene and the mesh has transparency, but if I use CubeCamera to render the same scene to a render target, the object lacks transparency.

I can work on a demo that reproduces the issue if you cannot reproduce.
Version: r175

camera.getWorldPosition(cameraWorldPos);
cubeCamera.position.copy(cameraWorldPos);
cubeCamera.update(renderer, scene);

const useShadows = renderer.shadowMap.enabled;
renderer.shadowMap.enabled = false;
let t = pmremGen.fromCubemap(cubeRenderTarget.texture);
scene.environment = t.texture;
renderer.shadowMap.enabled = useShadows;

Below: plants on the hill are rendered with transparency, and the same scene rendered to target with CubeCamera and applied as an envMap to the water plane, lacking transparency.

Reproduction steps

Code

// code goes here

Live example

• jsfiddle-latest-release WebGLRenderer
• jsfiddle-dev WebGLRenderer
• jsfiddle-latest-release WebGPURenderer
• jsfiddle-dev WebGPURenderer

Screenshots

No response

Version

175

Device

Desktop

Browser

Chrome

OS

Linux

[Mugen87]

What happens if you do this when setting up the render target for the cube camera?

cubeRenderTarget.samples = 4;

alphaToCoverage requires a MSAA context so if you don't configure it for the cube camera pass, it won't work.

That said, consider to use to alphaTest = 0.5 when during the cube camera pass. Using MSAA is expensive and I doubt a dynamic environment map requires that level of detail.

[lambocorp]

Is your suggestion to iterate all materials, set their alphaTest property for the env map render, then unset it after -- does that require material recompile / is expensive, if > 50 plant materials? I'd love to make the env map render as cheap as possible. You're right I don't need that level of detail. If you have other ideas to optimize it further please share!

I'm using pmndr's EffectComposer with MSAA.

const cubeRenderTarget = new THREE.WebGLCubeRenderTarget(256, {  
	type: THREE.HalfFloatType,
});

const renderer = new THREE.WebGLRenderer({
	antialias: true,
	stencil: false,
	depth: false,
})

renderer.setClearColor(0x000000, 0);

const composer = new EffectComposer(renderer);
composer.multisampling = Math.min(8, renderer.capabilities.maxSamples);
composer.addPass(new RenderPass(scene, camera));

If I set .samples on the target, I get this error:

[Mugen87]

Is your suggestion to iterate all materials, set their alphaTest property for the env map render, then unset it after

Correct.

does that require material recompile / is expensive, if > 50 plant materials?

The shaders are cached so that only happens once.

If I set .samples on the target, I get this error:

I think the issue is that multisampling isn't supported with cube render targets. So you can't use alphaToCoverage in your cube render pass.

[lambocorp]

Will the cache keep prior versions of the material (not just caching the current)? I render the cube map every N frames, so I would be continually switching back and forth between the two versions, alphaTest and then alphaToCov. It seems likely that when a material recompiles, the cache would not keep every prior version of the shader though...? Can you confirm which one it is or point me in the direction to check?

[Mugen87]

Will the cache keep prior versions of the material (not just caching the current)?

Yes, it will maintain all permutations of the material. I think you should easily spot shader recompilations in the framerate when you toggle materials properties. They should only happen the first time the renderers sees a specific material configuration.

[lambocorp]

So I will set .needsUpdate = true and the cache will get checked, skipping recompilation, or does .needsUpdate force recompile?

[Mugen87]

No, it doesn't. The renderer detects no new program is required.