InstancedMesh - transparent meshes

Questions
1

Hey,

So, I have an InstancedMesh object with thousands of semi-transparent textured cubes (see pic below).
From certain points of view, meshes can completely hide other meshes, even on the parts when they’re supposed to be transparent. (in the screenshot, the green box is theoretically transparent , but you can’t see other cubes behind it). Is it possible to somehow “sort” them based on their positions, like three.js does for “normal” meshes? Maybe that’d solve this issue

Capture
Capture838×538 188 KB

2

You can set alphaTest: 0.5 in your material, you don’t need to set transparent to true then.

2 Likes
3

@Fyrestar thank you for your answer, and sorry for the delayed response.
I did try your suggestion, this is what I got with “alphaTest: 0.5”, and “transparent: false” on the material:

Captur2e
Captur2e897×609 209 KB

So it seems, I’d need another suggestion, because it doesn’t solve my problem.

4

Can you share a demo? I think @Fyrestar’s suggestion is the right one, although you may need to tweak alphaTest or some other settings to get it working correctly.

1 Like
5

@donmccurdy Oh, I think I found the cause. I’m using a RawShader material with my own fragment shader, so the alphaTest is not included in my shader. If I manually add something like
if (alpha < 0.0001) discard;

then it works alright, although the edges of the icons are sharp, but that’s how I’d expect it to be in this case.

Thanks guys

1 Like