mrdoob/three.js — Issue #1163: Camera rotates around all 3 axes when only 2 should be necessary?
Author: rudiedirkx
Created: 2012-01-22 02:47:41+00:00
State: open

I'm very new to three.js and 3d in general, so excuse my ignorance =)

I came across someting very funny IMO, when playing with camera's, lights, positions, rotations etc. Originally I made this: http://hotblocks.nl/tests/three/cubes.html

The Camera's Y axis is rotated slightly to look left. That's correct. But now the Camera is too high, so I want it to look down. What I'd expect to have to to is turn down the Camera by rotating around its X axis. Slightly. That's it.

But when I do that, the Camera doesn't rotate around its axis, but the World (Scene?) does around its own axis. To get the result 'corrected', you need to change the Camera's Z axis as well. That's odd isn't it? That's not how the Camera would be rotated.

Rotating around its Y and Z axes work as expected. The result feels and looks right.

Then I found DAT.GUI, so I made this similar one: http://hotblocks.nl/tests/three/cubes2.html In the init I let the Camera `.lookAt(scene.position)`. The resulting Camera rotation is odd: all three axes are changed.

If I position the Camera at `500, 500, 0` (so to the right) and `.lookAt` the center, the Camera's rotation is `-90 deg, 45 deg, 90 deg`.

I don't get that at all! Even knowing the numbers, I can't figure out why they're like that. I can't image the Camera being rotated the way it is and showing what it does...

I'm pretty sure it's me, but what am I missing..?