Object observer + text overlay

Hi everyone,

Similar to what is shown in this video from 2:43 to 3:28, I am trying to figure out how this 2d text overlay pointing to a specific 3D point can be done (+ detection of point facing or not).

Have any of you crossed by chance a close tutorial somewhere out there?

Thanks for any helpful tips :slight_smile:

This is nice example for a WebGL scene with some HTML based 2D labels (symbols of the chemical elements):


It uses CSS2DRenderer for “rendering” 2D labels. Well, it’s not actually real rendering like in WebGL. CSS2DRenderer just ensures that DOM elements are transformed to their correct (3D) position.


Thanks Mugen.

This is good inspiration for the translation part and storing data in external files.

I am wondering if this would also somehow supported/incorporated into WebXR API for the AR projects, like having a virtual pointer for instance?