CSS3DRenderer hierarchy

Can three.js set the level for CSS3DRenderer so that objects that are far away will appear in the outermost layer? I failed to set renderorder. Is there any good method for three.js?

Possible duplicate of: CSS3DObject is visible through webgl 3D Objects

I looked at it, and that probably didn’t solve my problem. What I want to use is CSS3DSprite to arrange objects, and then can be set according to the level, CSS3DSprite only has distance, no level. I need to set rendeOrder to set the render order just like THREE.Sprite. Can the existing three.js meet my requirements

Okay, I see what you mean now. You are looking for a way to define the render order of CSS3DSprite objects.

renderOrder is currently not evaluated in CSS3DRenderer. However, since the sprites are normal HTML elements, you should be able to define the sorting via custom CSS. Any instance of CSS3DObject and thus all sprites are already positioned absolute. So defining z-index should be sufficient.

1 Like

z-index is invalid under the transform transform