search

marcofugaro / three-projected-material

📽 Three.js Material which lets you do Texture Projection on a 3d Model
https://marcofugaro.github.io/three-projected-material/
MIT License
671 stars 57 forks source link

Use transmission when backgroundOpacity is enabled #63

Closed Pao89 closed 11 months ago

Pao89 commented 1 year ago

Hi, i'm trying to use ProjectedMaterial to project a video on a cube, and i want the cube to move. I can play around with textureScale to not cut the video but it's inevitable there are gonna be some cuts. If i don't use backgroundOpacity then the cube won't render if texture is too small, if i use backgroundOpacity i want to be able to create the glass effect like in this article: https://tympanus.net/codrops/2021/10/27/creating-the-effect-of-transparent-glass-and-plastic-in-three-js/

Wherever the cube gets cut i want to be able to see through the glass the surround or at the very least the background. I tried using transmission (1) property to achieve that but i get some errors in the console.

Can you help me out? Thanks!

Pao89 commented 11 months ago

For those that wanted to achieve a more realistic glass effect around the mesh:

I achieved what i wanted by just wrapping my mesh with another mesh that had a configured MeshTransmissionMaterial from @pmndrs/drei-vanilla