I was testing transparecny in ThreeJS editor with MeshPhysicalMaterial. There seems to be some kind of noise in the output. Can anybody tell what could be causing this issue? My hunch is that its depth buffer calculation errors. Output & material properties snips are attached. [image] [image]

So, at that time what I did to solve this was to render all the opaque objects before transparent with depth write and depth test on. And then I rendered transparent with just depth write off so it was only compared against the opaque objects depth. To solve the problem of object with both transpar…

Does depthWrite → false change this? Can you share the model? The renderer cannot sort triangles before rendering, and so alpha blending is affected by the order. There’s no perfect fix for that – you ideally want triangles further away (or on the interior) to render first with alpha blending, but …

depthWrite to false makes it look weirder. I didn’t get your point on rendering the interior first. This is a single mesh with single-Sided Material. Let me check if I can share the asset.

Unfortunately no, three.js doesn’t sort triangles itself. You’d need to reorder the buffergeometry index. I don’t think that would fully fix the issue, but it would likely look less random.

[image] sirahi: Also, is there a way I can tell threejs to z-sort my triangles? Actually one thing you could try would be using the gltf-transform cli , if this is a gltf or glb file? gltf-transform reorder input.glb output.glb --target performance This doesn’t exactly z-sort triangles, but …

ThreeJS transparency output is not correct

Questions

sirahi November 30, 2021, 10:42am 4

Also, is there a way I can tell threejs to z-sort my triangles?

Strange behavior when there is another side of the same model beyond the model with opacity and transparent set

Topic		Replies	Views
ThreeJS and the transparent problem Questions transparency	50	33978	November 18, 2024
How to solve the rendering order for random meshes to get proper transparence Questions transparency , opacity	6	885	April 17, 2024
Material Transparency problem Questions transparency	7	20428	April 17, 2021
Need help making transparency show correctly in point cloud Questions geometry , transparency , point-clouds , z-index	9	1382	June 30, 2023
Three.js object become translucent at certain angles without setting transparency? Questions geometry , transparency	4	1028	August 28, 2022

ThreeJS transparency output is not correct

Related topics