title: Three.js: Rotate at center of an object
body: <p>I've modified this single spinning cube so that it contain 3 cubes in an Object3D</p>
  
  <p><a href="http://jsfiddle.net/VsWb9/1243/">http://jsfiddle.net/VsWb9/1243/</a></p>
  
  <p>In the above example it uses the first cube. I need it to rotate on a single axis at the exact center of the object. </p>
  
  <p>The object3D code </p>
  
  <pre><code>  geometry = new THREE.CubeGeometry(50, 50, 50);
      material = new THREE.MeshNormalMaterial();
      mesh = new THREE.Object3D();
      mesh1 = new THREE.Mesh(geometry, material);
      mesh1.position.x = 50;
      mesh2 = new THREE.Mesh(geometry, material);
      mesh2.position.x = 100;
      mesh3 = new THREE.Mesh(geometry, material);
  
      mesh.add(mesh1);
      mesh.add(mesh2);
      mesh.add(mesh3);
  
      scene.add(mesh);
  </code></pre>
  
  <p>Here is the rotation</p>
  
  <pre><code>  mesh.rotation.x += 0.01;
    mesh.rotation.y += 0.02;
  </code></pre>
  
  <p>EDIT: Just to say that this is an example to demonstrate the problem, my actual code object contains many different sized shapes.</p>