In a larger project, I place loaded models and self-created geometries optionally in bubbles. The bubbles are preferably spheres created with SphereGeometry or IcosahedronGeometry. However, they can also be other geometries such as BoxGeometry or CylinderGeometry.
This works well, but sometimes the transparent wings of the bee disappear.
For demonstration I have created a simple excerpt from the project: material.TEST
I found in some places that it is problematic when transparent materials are one behind the other.
But maybe there is a solution for my special case?
The problem is that the user can load any models into the bubbles. He only has to specify the file path or URL in the input.
The bee is just my example where I noticed the problem. Since I do not work with modeling software myself, I use simple, freely available models for testing. For example from google poly, which was shut down some time ago.
Setting material.depthWrite = false for all transparent materials, including those in the model, may help. Beyond that I think you’ll want to try to force the bubble to render last, e.g. with render order, after everything inside it.
