# Objects with transmission not showing objects behind

**URL:** <https://discourse.threejs.org/t/objects-with-transmission-not-showing-objects-behind/47113>\
**Category:** Questions\
**Tags:** materials, shaders\
**Created:** [January 20, 2023, 4:59pm UTC](https://discourse.threejs.org/t/objects-with-transmission-not-showing-objects-behind/47113 "2023-01-20T16:59:06Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Bersaelor](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/bersaelor/32/12884_2.png) [@Bersaelor](https://discourse.threejs.org/u/Bersaelor)\
**Post date:** [January 20, 2023, 4:59pm UTC](https://discourse.threejs.org/t/objects-with-transmission-not-showing-objects-behind/47113/1 "2023-01-20T16:59:06Z")

</div>

So, I setup a tinted glas material using the `transmission` parameter available in gltf 2.0:

 ![Screenshot 2023-01-20 at 17.45.21](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/d/4/d408dae43e7593ed8c8b0f34e1311514e6c47f92.jpeg)

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:

 ![Screenshot 2023-01-20 at 17.57.19](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/3/7/375fcad060bf1697b69c14d21492f1790bf23fbb.jpeg)

The second screenshot is also a Three.js scene, with the same material for the lenses.

Here’s the gltf in case you are interested:  
[metallpanto.gltf](https://discourse.threejs.org/uploads/short-url/dYOtmhLaTIlcKCu44Qtcb44odJH.gltf) (3.3 MB)

---

<div class="post-metadata">

**Author:** ![Chaser\_Code](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/chaser_code/32/20199_2.png) [@Chaser\_Code](https://discourse.threejs.org/u/Chaser_Code)\
**Post date:** [January 20, 2023, 5:41pm UTC](https://discourse.threejs.org/t/objects-with-transmission-not-showing-objects-behind/47113/2 "2023-01-20T17:41:13Z")

</div>

Try something like `material.depthTest=false` or `material.depthWrite=false` or renderOrder=1; renderOrder=-1

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [January 20, 2023, 7:06pm UTC](https://discourse.threejs.org/t/objects-with-transmission-not-showing-objects-behind/47113/3 "2023-01-20T19:06:26Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![drcmda](https://avatars.discourse-cdn.com/v4/letter/d/91b2a8/32.png) [@drcmda](https://discourse.threejs.org/u/drcmda)\
**Post date:** [January 20, 2023, 9:45pm UTC](https://discourse.threejs.org/t/objects-with-transmission-not-showing-objects-behind/47113/4 "2023-01-20T21:45:53Z")

</div>

it’s not possible. but you can use this: [MeshTransmissionMaterial: more realistic glas/epoxy/gelatin](https://discourse.threejs.org/t/meshtransmissionmaterial-more-realistic-glas-epoxy-gelatin/46522)

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.

---

<div class="post-metadata">

**Author:** ![drcmda](https://avatars.discourse-cdn.com/v4/letter/d/91b2a8/32.png) [@drcmda](https://discourse.threejs.org/u/drcmda)\
**Post date:** [January 20, 2023, 9:53pm UTC](https://discourse.threejs.org/t/objects-with-transmission-not-showing-objects-behind/47113/5 "2023-01-20T21:53:58Z")

</div>

ps you can see it working here:

 ![Screenshot 2023-01-20 at 22.53.32](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/d/e/de32690c6573ce152c8ee2499fa64832d5fd9726.jpeg)

> **[Using render texture through decals (forked) - CodeSandbox](https://codesandbox.io/s/using-render-texture-through-decals-forked-l8gkub)**
>
> Using render texture through decals (forked) by drcmda using @react-three/csg, @react-three/drei, @react-three/fiber, @react-three/postprocessing, @types/three, leva, react, react-dom, react-scripts

the bunny and the sphere have meshtransmissionmaterial and “see” one another, but they also see their own shadows, which is a transparent plane. MPM wouldn’t be able to do that as well.

---

<div class="post-metadata">

**Author:** ![aronanol45](https://avatars.discourse-cdn.com/v4/letter/a/f08c70/32.png) [@aronanol45](https://discourse.threejs.org/u/aronanol45)\
**Post date:** [December 14, 2024, 7:35pm UTC](https://discourse.threejs.org/t/objects-with-transmission-not-showing-objects-behind/47113/6 "2024-12-14T19:35:07Z")

</div>

Hi, trying to achieve the same effect [here](https://cfvtnq.csb.app/), trying to be able to see the text and the red plane trough the transmissionMat, and the transmission material being hidden by the green one.  
Seems like the transmission use a cube camera to apply the reflections or something like this, dont really understand the abstraction behind the process and to be honest, I feel stuck with this one.