Add a html label element besides each room to show the room no

Hi There,
I’m a beginner in threeJs.

I want to add a number as an HTML label or Text(react-three/fiber) element beside each room to showroom no. Here’s an example of what I mean:

Here’s the code in the sandbox: 3rddddddddddd - CodeSandbox

I used that:

      <Text position={position} anchorX="0px" font="/Inter-Regular.woff" fontSize={1} letterSpacing={0}>
        <meshStandardMaterial color="black" />

but it shows like that:

what’s the problem you were facing, why not just add it?

  <div className="myAnnotation">1</div>

and it’s done. if you don’t want it to face the camera add the transform option.

1 Like

Thank You for your response @drcmda .
Yeah kinda like that. But how can I face the camera exactly like the picture I showed?

Thank You so much.
It did worked