DoubleSided transmission unsupported with `WEBGL_multisampled_render_to_texture` (Oculus Browser)
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 116k
- Forks
- 36.6k
- Avg merge
- 19h 25m
- Merged PRs (30d)
- 164
Description
Description
When transmissive materials are set to DoubleSided the transmissive objects are rendered in two passes (see: https://github.com/mrdoob/three.js/pull/25502). The back side of the transmissive objects are rendered into the transmissiveRenderTarget while using the intermediate result of the transmissiveRenderTarget. This works as the target is multi-sampled and uses two textures under the hood.
However, when the EXT_multisampled_render_to_texture is supported by the browser, it is used instead of the two textures approach. In this case rendering the back-sides fails as source and destination textures are the same.
[.WebGL-0x20170a200]GL ERROR :GL_INVALID_OPERATION : glDrawElements: Source and destination textures of the draw are the same.
Reproduction steps
- Setup a scene with a double sided transmissive material
- Open in a browser that supports
WEBGL_multisampled_render_to_texture - Notice the back-side not being rendered and error(s) logged in the console
Code
const geometry = new THREE.SphereGeometry( 20, 64, 32 );
const material = new THREE.MeshPhysicalMaterial( {
metalness: 0,
roughness: 0,
ior: 1.5,
envMap: /* some equirectEnvMap */ hdrEquirect,
transmission: 1.0,
side: THREE.DoubleSide,
} );
mesh = new THREE.Mesh( geometry, material );
scene.add( mesh );
Live example
The bug is present in both webxr_vr_sandbox and webgl_materials_physical_transmission.
Screenshots
Without WEBGL_multisampled_render_to_texture |
With WEBGL_multisampled_render_to_texture |
|---|---|
Version
r163
Device
Headset
Browser
Chrome
OS
Android
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Reproduce the issue in the webxr_vr_sandbox and webgl_materials_physical_transmission examples using a double-sided transmissive MeshPhysicalMaterial in a browser supporting WEBGL_multisampled_render_to_texture. Trace the transmissiveRenderTarget handling for the back-side pass; done means the back side renders without the source/destination texture error, both with and without the extension.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- ar-vr-xr, computer-graphics
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 38/100