Rotating a custom geometry mesh around its center point

Question

When we add a CustomGeometry to the scene with defining vertices and not setting the position, how can we get it to rotate around its own center point?

Fiddle : http://jsfiddle.net/tezcancirakoglu/Ldt7z

In the sample code, object is rotating around Scenes X axis. I need to rotate it around its center point.

Hint: The red cube mesh is the initial centerpoint of the object which is rotating. I need to rotate it around x axis of red cube... I tried alot but failed anyway.

Answer 1

One solution is to translate the mesh geometry, and compensate by changing the mesh position, like so:

var offset = objMesh.centroid.clone();
objMesh.geometry.applyMatrix(new THREE.Matrix4().makeTranslation( -offset.x, -offset.y, -offset.z ) );
objMesh.position.copy( objMesh.centroid );

updated fiddle: http://jsfiddle.net/Ldt7z/165/

P.S. You do not need to save your fiddle before running it. There is no reason to have so many versions.

three.js r.55

Answer 2

You can use the center of the bounding box, which would basically be the 'average' of your vertices but it is not guaranteed to fall onto the red cube.