Get the group's width to center its X position

[5ervant]

How can I get the HALF_WIDTH of the 1st parent group of my Text, so that I can center my text's 1st parent group relative to the other mesh?

<group>
  <group position={[HALF_WIDTH, 0, 0]}>
    <Text hAlign="left">Test text</Text>
  </group>
  <mesh>
     {/* My cylinder mesh */}
  </mesh>
</group>

The text center should be at the center of my cylinder:

[drcmda]

const [offset, set] = useState(0)
useLayoutEffect(() => {
  ref.current.geometry.computeBoundingBox()
  set(-ref.current.geometry.boundingBox.min.x / 2)
}, [])
return (
  <group position={[offset, 0, 0}>
    <mesh ref={ref} ...

more or less, something like that

[5ervant]

It works, I wonder why I need to do offset / 10 to get the actual offset of my group's group's child mesh.

let init = false;

useFrame(() => {
    if (!init) {
      const [parent] = ref_parent.current.children;
      if (parent) {
        const [mesh] = parent.children;
        set(mesh.geometry.boundingBox.max.x / 2);
        init = true;
      }
    }
  });

//...
  <group ref={ref_parent} position={[offset / 10, 0, 0]}>

Anyway, it's working..

[drcmda]

yeah dealing with textgeom isnt the most straight forward, i have often scratched my head over it. but trust me it's way better than canvas text which truly was a hell to get even close to looking ok 🤷‍♂️