Camera rotation axis glitch

Questions
,
1

Hello, I am working on a three js game and the camera rotation is a lil’ bit buggy like the camera looks like a VR game but I need it to be like a normal first person camera rotation system.
Here is the code i have for my first person game

document.onmousemove = function(e){
  camera.rotation.x -= e.movementY / 150
  camera.rotation.y -= e.movementX / 150
}

That’s the code of my first person camera. What I think is that the camera is rotating along its own axis or something like the x and y rotations are interfering together you feel me? But that’s what I think.

My game footage down here.

2

You probably have to change the euler order of your camera rotation.
The default is "XYZ". Setting this to "YXZ" (the “yaw-pitch-roll” order) would work fine.

https://threejs.org/docs/?q=euler#api/en/math/Euler.order

4

Hey if you can, give me like just a code snippet of it or i could do it myself.

5

You should probably give us your current code first. Sandbox services like Glitch or CodeSandbox would be preferable in order to check the behavior.

6

alright ima do it

7

ok im done with the sandboxing lol

8

Add camera.rotation.order = "YXZ"; to L26 and it should work properly.

1 Like
9

Bro THANKS TOO MUCH that works bro i had this problem for a long time

10

Your description was appropriate. Thank you for the video and the code.

11

yeah dawg :3