How can I rotate around the center of a group in Three.js
<p>I've created a group of cubes and I'm trying to figure out how to set the center so I can rotate them.</p>

<p>Here is the fiddle: <a href="https://jsfiddle.net/of1vfhzz/" rel="noreferrer">https://jsfiddle.net/of1vfhzz/</a></p>

<p>Here I add the cubes:</p>

<pre><code>side1 = new THREE.Object3D();
addCube({ name: 'side1topleft', x: -8.5, y: 7.5, z: 5 });
addCube({ name: 'side1topmiddle', x: -4, y: 7.5, z: 5 });
addCube({ name: 'side1topright', x: .5, y: 7.5, z: 5 });
addCube({ name: 'side1middleleft', x: -8.5, y: 3, z: 5 });
addCube({ name: 'side1middlemiddle', x: -4, y: 3, z: 5 });
addCube({ name: 'side1middleright', x: .5, y: 3, z: 5 });
addCube({ name: 'side1bottomleft', x: -8.5, y: -1.5, z: 5 });
addCube({ name: 'side1bottommiddle', x: -4, y: -1.5, z: 5 });
addCube({ name: 'side1bottomright', x: .5, y: -1.5, z: 5 });
scene.add(side1);

function addCube(data) {
    var cube = new THREE.Mesh(cubeGeometry, cubeMaterial);
    cube.position.x = data.x
    cube.position.y = data.y
    cube.position.z = data.z
    cube.rotation.set(0, 0, 0);
    cube.name = data.name;
    side1.add(cube);
}
</code></pre>

<p>Then in <em>render scene</em> I rotate it around the y-axis, but I need to set the center. I tried <code>translate</code>, but I'm not getting it.</p>