Furnace Test Example: added transmission to the test

[WestLangley]

... plus other minor fixes.

[WestLangley]

It appears that orthographic camera, PMREM, and/or transmission are mutually incompatible, so I reverted the camera back to a perspective one.

[mrdoob]

Thanks!

[WestLangley]

@Mugen87 If transmission is set to 1, then this example renders incorrectly on the first rendering. Move the mouse to force another render.

I expect all the promises in this example are not required, but even after removing them and simplifying the example to follow the typical three.js coding pattern, the issue remains. It seems like transmission thinks the background is black...

[Mugen87]

If transmission is set to 1, then this example renders incorrectly on the first rendering. Move the mouse to force another render.

I can reproduce. However it's not clear to me whether this is only an issue in the first frame or if the transmission implementation is frame-late in general.

@takahirox Do you mind having a look? Here is a test case: https://jsfiddle.net/psjwzyft/

[mrdoob]

Doing this shows that it's a frame late indeed:

function render() {

  renderer.render(scene, camera);
  renderer.render(scene, camera);

}

[takahirox]

@takahirox Do you mind having a look? Here is a test case: https://jsfiddle.net/psjwzyft/

OK, let me try hopefully this weekend

[takahirox]

I investigated the problem this weekend but I couldn't find the root issue. But I found some weird behaviors. Does anyone here have any clues from them?

• In webgl_furnace_test example with transmission=1, the problem was disappeared if I set renderer.outputEncoding = THREE.sRGBEncoding
• In webgl_furnace_test example with transmission=1, the problem was disappeared if I set scene.background = new THREE.Color( COLOR ); instead of hdrEquirect
• The problem can reproducible even in webgl_materials_physical_transmission example if I comment out the hdrEquirect.mapping = THREE.EquirectangularReflectionMapping; and renderer.outputEncoding = THREE.sRGBEncoding; lines

So, sounds like the problem happens with linear outputEncoding (default) and certain scene.background?

[Mugen87]

After merging #22394, the following warning appears now in the first render call of the fiddle:

[.WebGL-0x7ffe34856400]RENDER WARNING: there is no texture bound to the unit 0

The warning does not appear in the unmodified version of the furnace test.

[Mugen87]

Is seems the issue can be fixed by forcing a uniform update of the scene's background before the opaque objects are rendered for the transmissive pass. Meaning before the following line:

three.js/src/renderers/WebGLRenderer.js

Line 1269 in 57b7a9b

renderObjects( opaqueObjects, scene, camera );

I add this hack.

opaqueObjects[ 0 ].material.uniformsNeedUpdate = true; // the first render item is the skybox

Of course this is only for testing since it just works with the fiddle.