Debug camera (react-three/drei)

[romankoho]

Hi,

I'm trying to debug my camera (position, etc.). I'm using react/three-drei and in my scene. When changing the position in the debug UI, it does not change the camera in the scene. Here is the code:
https://stackblitz.com/edit/vitejs-vite-9ww3xp?file=src%2FScene.tsx

any help is appreciated. thanks

[Remi-Tribia]

this is old and not related to leva but...
your canvas is setup to render on "demand" so you need to use invalidate() :

  const { camera, invalidate } = useThree();

  useControls('camera', {
    cameraPosition: {
      value: { x: 1, y: 1, z: 1 },
      step: 0.01,
      onChange: (v) => {
        camera.position.copy(v);
        invalidate();
      },
    },
    cameraTarget: {
      value: { x: 0, y: 0, z: 0 },
      step: 0.01,
      onChange: (v) => {
        orbitControls.current.target.copy(v);
        invalidate();
      },
    },
  });

[romankoho]

thanks for your help and explanation :)