title: Three.js extract rotation in radians from camera
body: <p>I've been struggling for a while with the concepts of quaternions and I think that it may have something to do with this particular challenge.</p>
  
  <p>If you know three.js, you may be familiar with the equirectangular panorama video example. What I've been trying to do is to simply extract the camera's rotation at any given moment in a format that I understand (radians, degrees...) for each axis. In theory, shouldn't I be able to simply tap into the camera's rotation.x/y/z parameters to find those out? I'm getting strange values, though.</p>
  
  <p>Check out this example:
  <a href="http://www.spotted-triforce.com/other_files/three/test.html" rel="nofollow">http://www.spotted-triforce.com/other_files/three/test.html</a></p>
  
  <p>I'm outputting the camera's xyz rotation values at the upper left corner and instead of expected values, the numbers bounce around between positive and negative values.</p>
  
  <p>Now, this example doesn't use one of the control scripts that are available. Rather, it creates a vector to to calculate a camera target to look at. Here's what the camera code looks like:</p>
  
  <pre><code>function init() {
    camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 1, 1100 );
    camera.target = new THREE.Vector3( 0, 0, 0 );
  }
  
  function onDocumentMouseDown( event ) {
  
    event.preventDefault();
    isUserInteracting = true;
  
    onPointerDownPointerX = event.clientX;
    onPointerDownPointerY = event.clientY;
  
    onPointerDownLon = lon;
    onPointerDownLat = lat;
  
  }
  
  function onDocumentMouseMove( event ) {
  
    if ( isUserInteracting === true ) {
  
      lon = ( onPointerDownPointerX - event.clientX ) * 0.1 + onPointerDownLon;
      lat = ( event.clientY - onPointerDownPointerY ) * 0.1 + onPointerDownLat;
  
    }
  }
  
  function onDocumentMouseUp( event ) {
    isUserInteracting = false;
  }
  
  function update() {
  
    lat = Math.max( - 85, Math.min( 85, lat ) );
    phi = THREE.Math.degToRad( 90 - lat );
    theta = THREE.Math.degToRad( lon );
  
    camera.target.x = 500 * Math.sin( phi ) * Math.cos( theta );
    camera.target.y = 500 * Math.cos( phi );
    camera.target.z = 500 * Math.sin( phi ) * Math.sin( theta );
  
    camera.lookAt( camera.target );
  
  }
  </code></pre>
  
  <p>Does anybody know what these strange values are that I'm getting and how I can extract proper rotation values that I can then use on another object to mirror the motion?</p>