As I delve into the complexities of three.js coordinate spaces, I have come to understand the significance of object.matrix and object.matrixWorld.
After discovering a thought-provoking blog post titled Matrix Basics. How to step away from storing an orientation as ’3 angles’, I was inspired to explore manual manipulation of Matrix4 properties as opposed to relying on Euler rotations.
My objective seems simple - translating my cube away from the origin at 0,0,0 and then rotating it in world space. The envisioned result is for the cube to first translate along the y-axis before executing a rotation that brings it back to the plane in a sweeping arc. However, in reality, it simply reverts back to the origin without acknowledging the translation.
Despite delving into extensive readings on vectors and matrices, I struggle to grasp how three.js manages the matrixWorld and matrix. My attempts with both have left me perplexed!
To showcase my dilemma, I have created a fiddle: http://jsfiddle.net/SCXNQ/151/
Please review the render() function to witness my endeavor firsthand!
EDIT - [solved] UPDATED JS FIDDLE OF WORKING VERSION 14/09/12
Thanks to the insightful answer below, I have updated my fiddle to demonstrate the intended outcome - http://jsfiddle.net/SCXNQ/363/