Question

I've just started with Three.js. Like really just now.

After playing with it for an hour or so and building a tool that helps me understand how the different elements work together (Camera, Light, Objects), I found something strange.

The tool: http://hotblocks.nl/tests/three/cubes.html

This is the current default set up:

  • the Camera is positioned 210 upwards and
  • 500 backwards and
  • 246 to the right
  • the Camera is rotated slightly to the left
  • the light is directly above and shines in all directions

As you can see, the objects are at the very bottom of the viewport. So I want to turn the Camera downward, so I can see more of them.

Try that: turn camera.rotation.x down.

That works, but the angle of rotation is wrong! Instead of the Camera rotating, it's the World rotating around its Z axis.

That's not right, is it?

The Y axis is also wrong. It rotates the World around its Y axis.

Rotating the Camera around its Z axis, works perfectly: the Camera rotates, not the World.

Am I doing it wrong? Or understanding it wrong?

PS Since the Camera rotation is only around its Y axis, the objects' vertical edges should be vertical in the result as well. In the default set up, they are. Rotating the camera around its X axis, shouldn't change that, but it does. Only rotating around its Z axis should change that (and it does). Am I wrong?

PPS I know about Camera.lookAt( THREE.Vector3 target ), but that changes the rotation of the camera, including its Z axis, and that shouldn't be necessary, logically.

No correct solution

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top