Moving the camera, lookAt and rotations in three.js

Question

I\'m having trouble understanding lookAt and the rotations of the camera.

I have a circle of small spheres around [0,0,0] on the x-y plane.

The camera is pla

Answer 1

To fix the problem you can specify the up vector for the camera before executing the lookAt() command.

// Place camera on x axis
camera.position.set(30,0,0);
camera.up = new THREE.Vector3(0,0,1);
camera.lookAt(new THREE.Vector3(0,0,0));

Change the vector to your needs. You can even turn it upside down by specifying a negative value: (0,0,-1). It is important to set the up vector BEFORE using lookAt().

I have created a full example at http://jsfiddle.net/VsWb9/991/ with 2 cubes. The smaller one is suppose to be on top of the big one (on the positive z-axis).