Does anyone know how to make a Mirror transparent working with opacity? with https://threejs.org/examples/webgl_mirror.html and https://threejs.org/examples/?q=mirror#webgl_mirror_nodes I can’t seem get it to work at all. Also I don’t understand the fragment shader yet but might be some clues for this. https://stackoverflow.com/questions/32992156/three-js-opaque-mirror Thanks!
Opacity is not supported by default. However, you can enhance Reflector to achieve this.
The idea is to add an additional uniform called opacity and make use of it in the reflector’s fragment shader.
Live demo: https://jsfiddle.net/kyw9s2vL/2/
3 Likes
So, it is based-on Reflector and additional custom shader?
Wow, I really need to learn more about GLSL shading.
Much appreciated and huge Thanks!
Yes, correct!
1 Like
@Mugen87
Thank you for showing how to modify the opacity and feed it into the fragment shader. I have been trying to do a similar thing but feed an alpha mask with a gradient so that I could have a reflector that fades from full opacity on one side to zero opacity to another, but I bogged down.
Could you perhaps share a jsfiddle where you manually feed an alpha mask into the reflector’s fragment shader? Thank you!