Using CameraShake alongside camera.lookAt

[xzilja]

I have following setup with custom camera

     <group position={[60, 30, 0]} ref={groupRef}>
      <PlayerModel ref={playerRef} position={[0, 0, 0]} />

      <PerspectiveCamera
        makeDefault
        position={[4, 3, 0]}
        fov={30}
        aspect={innerWidth / innerHeight}
        near={0.1}
        far={100}
        ref={cameraRef}
      />
    </group>

Alongside this, there is a useFrame logic that forces camera to always look at the player (as player can rotate and change position)

useFrame(() => {
        const { x, y, z } = playerRef.current.position
        const lookTarget = new Vector3(x, y, z)
        camera.lookAt(lookTarget)
  })

This works as expected, however I also want to add camera shake, so that in the end camera follows player with slight shake. Right now adding camera shake from drei to the scene has no effect, I assume its due to lookAt logic above

     <CameraShake
        maxYaw={0.01}
        maxPitch={0.01}
        maxRoll={0.01}
        yawFrequency={0.5}
        pitchFrequency={0.5}
        rollFrequency={0.4}
      />

I wanted to ask if what I'm after is achievable with provided tools, before attempting to write some custom logic.

[njm222]

@iljadaderko Are you able to create a sandbox so that we can debug the issue?

Are you using orbit controls?

[xzilja]

Was able to achieve what I was after with simple Math.sin/cos functions. Camera shake wasn't viable as camare was set to lookAt and follow position of another object, so while it was working it was always reset in useFrame