I also gave the material a little metallicity (0.38) to make it more reflective, while it’s transmission is 1.0.
(The screenshot uses a simple three.js scene with one mesh for the dragon and a flat THREE.PlaneGeometry behind it. The object behind shines through nicely).
Now when I put together a model , using different materials, (glasses in this case), I can not see the objects behind the thin glasses anymore:
There’s a complex mix of transmission, alpha blending (.transparent = true), and opaque materials here, which you probably don’t want. Note that transmission only shows opaque surfaces behind it. Transmissive and transparent surfaces are not visible behind a transmissive surface.
Also – it’s usually best to have .transparent = false on your transmissive materials, to keep metalness at 0, and to decrease roughness instead if you prefer crisper reflections.
it looks a thousand times better, is otherwise based on MPM with the same props, and doesn’t have that problem as it “sees” all. and it’s faster, too.
there is a vanilla material in the post, though, sadly, it reverts back to the problem as it can’t see other transmissive/transparent objects. but the code that makes it support that is very little, you can quickly add it from the react material. it just can’t be a self contained single class no more because it needs some setup.