math3d-react
math3d-react copied to clipboard
Rendering surfaces with opacity
(I promise this is the last issue I'm posting.. today)
I've drawn 2 unit spheres, one with an implicit surface and one with parametric. I've set both of their opacities to 0.75. The result (from some view angles) is a bit weird: https://www.math3d.org/QevvGSMZ
There seem to be weird discs rendered inside of the top one, and for the bottom one they're half-discs coming out of the center.
This issue only occurs when looking through two layers of translucent surfaces. For another example, consider these 2 parallel planes: https://www.math3d.org/1N8ODBEG
From above it seems alright (where the two overlay, it's darker):
But from below, it seems to forget that it should be darker (and it's doing weird things with the mesh):
The underlying graphics library that math3d uses is MathBox.
Here's a post by MathBox's creator (Steve Wittens) that summarizes the issue: https://groups.google.com/d/msg/mathbox/Dt8o-zNiAsE/2b8GvzX9BgAJ. Truthfully, though, I'm not really an expert on 3d graphics (though it's something I'm always interesting in learning more about!) and so am still working to understand some of the details.
I just spent a while playing with {zWrite: false}
and blending modes as Steve mentions, but I'm not totally satisfied with that either.
Related: https://www.sjbaker.org/steve/omniv/alpha_sorting.html
Oh: the issue with parametric surfaces is, I believe, related. I suspect it has to do with which part of the sphere is being drawn first, but I am not really sure.
Edit: So... Yes, this is an issue. I might explore it more, but I think a perfect fix would be hard, and other workarounds have downsides.