X-Ray effect over a texture

Grigory_Moroz · March 8, 2021, 5:24am

Hi, I want to achieve some kind of a x-ray effect on a model. The idea is to have two textures on a model and circle cursor (with some radius) which will make first texture transparent when it’s over a certain area of a model. I found a great example of it here: Making Gooey Image Hover Effects with Three.js | Codrops, however I have another thing to handle. I also want to “reveal” some parts of a model on click (using raycasting I suppose).

I was thinking that I can use alphaMap but as far as I know it can be applied only to a whole mesh and there’s no way to move it with mouse coordinates.

It would be great if you guys can suggest some ideas on how I can achieve it. Many thanks!

prisoner849 · March 8, 2021, 8:52pm

Hi!
Recently, I’ve made an example with kind of X-Ray. Maybe it will be helpful for you somehow:

Picture:

Example:

Grigory_Moroz · March 13, 2021, 9:06am

Hi! Thanks for sharing this great example, looks like almost exactly what I needed.

Serge · July 30, 2021, 8:07pm

Does this need anything special to work on a skinned mesh ? Can’t seem to get it to work correctly…would greatly appreciate the help if you have the time

Topic		Replies	Views
X-ray Effect for transparent Meshes Questions materials , wireframe , mesh , transparency , outlineeffect	3	2111	May 9, 2021
Modify dynamic texture float 32 array with frag shaders Questions textures , fragment-shader , texture-array , float32array	3	1174	January 27, 2021
How to make transparent texture light effect? Questions textures , materials , shaders	2	694	April 17, 2022
Png as displacement map Questions textures , shaders , animation	3	803	March 7, 2022
How to project a texture/shape to specific part of a mesh? Questions textures , mesh , shaders	1	1463	October 8, 2021

X-Ray effect over a texture

Related topics