uikit icon indicating copy to clipboard operation
uikit copied to clipboard
verified publisher icon pmndrs

Maximum Call Stack Sized Exceed when using TransformControls inside of Content

Open jelling opened this issue 1 year ago • 2 comments

Is it not possible to use <TransformControls> inside of a <Content>? For me it throws Maximum Call Stack Sized Exceed. PivotControls doesn't throw this error fwiw.

Code

    <Canvas
      style={{
        position: 'fixed',
        top: 100,
        left: 0,
        right: 0,
        bottom: 0,
        height: '100vh',
      }}
    >
      <Fullscreen>
        <ambientLight intensity={2} />
        <Container width="7%"></Container>
        <Container width="86%">
          <Content>
            <TransformControls>
              <RoundedBox args={[1, 1, 1]}>
                <meshPhongMaterial color="#f3f3f3" wireframe />
              </RoundedBox>
            </TransformControls>
          </Content>
        </Container>
        <Container width="7%"></Container>
      </Fullscreen>
    </Canvas>
Call Stack 
Call Stack
Matrix4.compose
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (6577:1)
Mesh.updateMatrix
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7734:1)
Mesh.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7742:1)
Group.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
TransformControls.eval [as updateMatrixWorld]
../../node_modules/.pnpm/[email protected][email protected]/node_modules/three-stdlib/controls/TransformControls.js (109:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Group.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
PerspectiveCamera.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
PerspectiveCamera.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (12479:1)
TransformControls.eval [as updateMatrixWorld]
../../node_modules/.pnpm/[email protected][email protected]/node_modules/three-stdlib/controls/TransformControls.js (119:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Group.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
PerspectiveCamera.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
PerspectiveCamera.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (12479:1)
TransformControls.eval [as updateMatrixWorld]
../../node_modules/.pnpm/[email protected][email protected]/node_modules/three-stdlib/controls/TransformControls.js (119:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Group.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
PerspectiveCamera.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
PerspectiveCamera.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (12479:1)
TransformControls.eval [as updateMatrixWorld]
../../node_modules/.pnpm/[email protected][email protected]/node_modules/three-stdlib/controls/TransformControls.js (119:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Group.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
PerspectiveCamera.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
PerspectiveCamera.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (12479:1)
TransformControls.eval [as updateMatrixWorld]
../../node_modules/.pnpm/[email protected][email protected]/node_modules/three-stdlib/controls/TransformControls.js (119:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)
Object3D.updateMatrixWorld
../../node_modules/.pnpm/[email protected]/node_modules/three/build/three.module.js (7774:1)

jelling avatar Sep 16 '24 00:09 jelling

It also throws the same error when directly inside a <Container>:

        <Container width="86%">
          <TransformControls>
            <RoundedBox args={[1, 1, 1]}>
              <meshPhongMaterial color="#f3f3f3" wireframe />
            </RoundedBox>
          </TransformControls>
       </Container>

jelling avatar Sep 16 '24 00:09 jelling

@jelling could you please provide a codesandbox to reproduce the error :)

bbohlender avatar Sep 25 '24 14:09 bbohlender

I'm closing this because I decided not to use uikit for my current project.

That said, even after the "maximum call stack" issue went away - I changed a lot of things in my project - I had other issues with both TransformControls and PivotControls within uikit <Container>. Issues I saw were Y axis movement worked but no other axis. And the sizing seemed completely off.

jelling avatar Oct 15 '24 17:10 jelling