diff --git a/src/App.tsx b/src/App.tsx index 049370c..a798b1e 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -97,21 +97,27 @@ const Scene = () => { const helper = // @ts-expect-error 16 elements camera.applyMatrix4(new THREE.Matrix4(...extrinsic)) + + const textRef = useRef(null) + const { camera: viewCamera } = useThree() + + useFrame(() => { + if (textRef.current) { + textRef.current.lookAt(viewCamera.position) + } + }) + let text: JSX.Element | null = null if (name) { - // https://github.com/pmndrs/react-three-fiber/discussions/832 const geo = new THREE_ADDONS.TextGeometry(name ?? "", { font, size: textSize ?? 0.1, depth: 0.001 }) - - // Extract camera position from extrinsic matrix const matrix = new THREE.Matrix4() // @ts-expect-error 16 elements matrix.set(...extrinsic) const position = new THREE.Vector3() position.setFromMatrixPosition(matrix) - // Create text without applying camera matrix transformation text = ( - +