Camera position and rotation around on object

Questions
, ,
1

Hi, I have a question about camera position and rotation around on object.

I want to draw top, front, side view of object(3d bounding box).

Drawing top view is fine. but front and side view camera isn’t rotated correctly.

how I fix the problem?

my code is below

image
image3076×1406 263 KB 

// Top view
{
    left: viewFullLeft,
    top: viewMainHeight,
    width: viewWidth,
    height: viewHeight,
    background: new THREE.Color(22 / 256.0, 22 / 256.0, 22 / 256.0),
    // up: [0, -1, 0],
    up: [0, 1, 0],
    fov: 70,
    camera: undefined,
    updateCamera: function (camera, objectPosition, objectAngle) {
        camera.position.set(objectPosition.x, objectPosition.y+10, objectPosition.z);
        camera.lookAt(objectPosition);
        camera.rotation.z = objectAngle + Math.PI;
    }
},
// front view
{
    left: viewFullLeft + viewWidth,
    top: viewMainHeight,
    width: viewWidth,
    height: viewHeight,
    background: new THREE.Color(22 / 256.0, 22 / 256.0, 22 / 256.0),
    // up: [0, 1, -1],
    up: [0, 1, 0],
    fov: 70,
    camera: undefined,
    updateCamera: function (camera, objectPosition, objectAngle) {
        camera.position.set(objectPosition.x, objectPosition.y, objectPosition.z-10);
        camera.lookAt(objectPosition);
        camera.rotation.y = objectAngle + Math.PI;
    }
},
// side view
{
    left: viewFullLeft + 2*viewWidth,
    top: viewMainHeight,
    width: viewWidth,
    height: viewHeight,
    background: new THREE.Color(22 / 256.0, 22 / 256.0, 22 / 256.0),
    up: [-1, 1, 0],
    fov: 70,
    camera: undefined,
    updateCamera: function (camera, objectPosition, objectAngle) {
        camera.position.set(objectPosition.x+10, objectPosition.y, objectPosition.z);
        camera.lookAt(objectPosition);
        camera.rotation.y = objectAngle-10/180*Math.PI;
    }
}
2

Assuming you are using OrthographicCameras for top, front and side views, and the 3d bounding boxes are axis -aligned:

then I expect any non-zero objectAngle to spoil your camera.rotation.

As for the positions, the assumption is, that the

  • top view is looking from positive y-axis towards origin
  • bottom view is looking from negative y-axis towards origin
  • right view is looking from positive x-axis towards origin
  • left view is looking from negative x-axis towards origin
  • front view is looking from positive z-axis towards origin
  • back view is looking from negative z-axis towards origin

Include an AxesHelper if you get lost in space.

[Edit:] since the camera’s default orientation is “looking down negative z-axis”, i.e. front view, it’s only the back view that requires a Math.PI rotation. All other views can be reached via a Math.PI / 2 rotation.