Highlight mesh ,when multiple meshes uses the same material

Before, i used yellow color on the material’s emission channel to simulate mesh highlight onm pointer click

now i got a case where there are 4 mesh & all use the same material

how can i highlight a single mesh ?

i can’t use scale to make the mesh big while highlighting as there’s parent child hierarchy in this node tree and the children also get affected

is there some quick way to highlight just the mesh ? vertex color maybe ?

outline pass? Post Processing - Demo

1 Like

oh yeah, outline pass, that will work

is there any other options available ? not using post processing at all right now , want to look at all other available options

I think a general solution here would be to keep a separate highlight material around, swap it out when you want to mark something. Vertex color would also work, requires uploading a few bytes per vertex to the GPU so a bit slower than setting a uniform on a material, and assumes you’re not also sharing geometries with another mesh. :wink:


Hot swapping materials seems like a good plan , i’m guessing the micro stutter will only happen the first time then onwards it’ll be smoooth

Yep! Would also be an option to precompile the material.


When highlighting, I check if the material was used elsewhere. If it is a shared material, I set the highlighted material to material.clone().
something like this

if ( isMaterialUsedElsewhere( material ) ) object.material = material.clone();

Easier options is to just make a yellow meshBasicMaterial or meshStandardMaterial with yellow emission (animate the color/strength for fanciness) and just apply this material when you want to highlight something and restore the original material on exitHighlight/timeout

I agree, that is quite an elegant solution I hadn’t thought of. The only benefit I can think of with cloning the material is that is preserves other properties of the material (e.g. texture maps), which you might lose if you created a generic material.

1 Like