Hello. The common solution is to set depthTest: false to a material, but this only works if there are no more objects in the scene with transparent: true.
First example. Yellow ring with depthTest: false, other materials are default:
Second example. The same for the ring, but the red plane with transparent: true:
How to render an object always on top regardless of other objects’ settings?
what are the properties of the object you always want on top? there’s the option of using Object3D.renderOrder but as stated in the documentation…
opaque and transparent objects remain sorted independently.
If you want to override the policy of object render ordering, you can do this:
renderer.render( scene, camera ); // render the scene as it is
renderer.render( object, camera ); // render only the special object
This is possible, because WebGLRenderer.render can render not only whole scenes, but also individual objects.
PS. You must also take care about the automatic clearing of depth and color buffers, because you might want to clear the depth buffer between the two renderings, but preserve the color buffer intact.
An object as such, no matter what it looks like. And so that it overlaps any object in the scene, regardless of the settings of such objects.
It works, thanks.