Odd occlusion in 3d lab

Hi. New codea user here. Changed a few things in the 3d lab sample and saw something odd.
It looks fine from the front, but when it’s turned around, the blue circle and the text appear to be surrounded by opaque black rectangles. I am drawing the blue circle first, then the text, then red. What is happening?

Looks like draw order.

3d (in OpenGL) is an illusion - it’s all still rendered to a 2d plane. And when you want to support transparency, draw order matters. In the beginning with the red ellipse in front, the draw order is likely floor, blue ellipse, text, red ellipse.

But when you spin it, without changing the draw order, you draw floor (ok), blue ellipse - but then text and the red ellipse are clipped, as they’re behind another object. The 3D engine doesn’t know from transparent - it’s not quite that smart.

Presumably each frame (or less frequently if you can get away with it), you’d need to recalculate draw order for the elements, based on their Z position. This is the ugly side of 3d.