Texturemap UV with independent alphamap

Questions
,
1

I have a large texture -a photo- and small simple meshes that should display regions of the main texture. These meshes should have an alphaMap, for example a circle.

In the mesh material’s texture (PlaneBufferGeometry), I change the UV mapping so it will display the proper region of the main texture. The problem is that the UV mapping is also applied to the alphaMap but I want it independent.

See this fiddle: https://jsfiddle.net/truji7/raq6o38w/33/
First one is with no remapping, 2nd setting the UV textures and 3rd calling texture.repeat.set(.5,.5);
One would say that repeat is applied to the texture only, no other maps, but it seems to affect to all.

The accepted answer at
https://stackoverflow.com/questions/59972629/threejs-texturemap-uv-with-independent-alphamap/59975383#59975383 works beautifully but involves messing the shader. I wonder if there’s some other way to set the UV map of the texture only leaving other maps unchanged/independent from the texture.

2

Nope, this is currently not supported by built-in materials. Instead of patching the shader, you can use the experimental NodeMaterial which does support this use case.

https://threejs.org/examples/webgl_materials_nodes

3

I think I disagree with that statement. Built in materials are flexible albeit not user friendly.

If you’re open to implementing some code outside of threejs, you can check out this tutorial, I believe it covers your use case exactly.

1 Like