4

I'm trying to make a rubik cube game in webgl using three.js (you can try it here). And I have problems to detect on witch axis I have to rotate my cube according the rotation of the cube. For instance, if the cube is in original position/rotation, if I want to rotate the left layer from down to up, I must make a rotation on the Y axis. But I rotate my cube 90 degrees on Y, I will have to rotate It on the Z axis to rotate my left layer from down to up.

I'm trying to find a way to get the correct rotation axis according the orientation of the cube. For the moment I check witch vector of the axis of the rotation matrix of the cube is most parallel with the vector(0,1,0) if I want to move a front layer from down to up. But it do not works in edge cases like this for instance :

cube orientation

I guess there is some simple way to do that, but I'm not good enough in matrix and mathematical stuff :)

Christophe Belpaire
  • 308
  • 2
  • 7
  • It would help if you labeled the axes _x_, _y_, _z_, and edited your question to use these instead of "left", "down", etc. Also, for rotations, use words like "CW" and "CCW", assuming the drawn axes are positive in direction. As it stands, your descriptions are quite ambiguous. – Andrew Cheong Dec 26 '12 at 17:32
  • 4
    One thing you might want to consider is using something like `TrackballControls` when you drag the mouse. (Or code your own version.) That way, it is the _camera_ that moves, and the Cube itself remains oriented parallel to the global axes. This way, rotations are simpler. Also, setting the background to black looks even better, IMHO. :-) – WestLangley Dec 26 '12 at 18:01
  • You could control the camera like @WestLangley said or you could add your individual rubik pieces to a parent object3D and then use your controls on that. That way when you apply changes to the individual pieces it will be locally within the parent object3D so they should always have their default (easy to use) orientations.... at least I think that is the case, it is something I have done with [this](http://0xor1.com/Sudoku). – Daniel Robinson Jan 30 '13 at 14:30
  • I do it like this: [Quaternion rotation do not works as excepted](http://stackoverflow.com/a/39024016/2521214) – Spektre Sep 26 '16 at 10:14

2 Answers2

0

An AxisHelper can show the aixs of the scene which you could determine the orientation with.

var axishelper = new THREE.AxisHelper(40);
axishelper.position.y = 300;
scene.add(axishelper);

You could also log your cube and check the position and rotation properties with Chrome Developer Tools or Firebug.

MCSharp
  • 1,068
  • 1
  • 14
  • 37
0

You can store the orientation of each cube in its own 4x4 matrix (i.e. a "model" matrix) that tells you how to get from the cube's local coordinates to the world's coordinates. Now, since you want to rotate the cube around to an axis (i.e. vector) in world coordinates, you need to translate the axis into cube coordinates. This is exactly what the inverse of the model matrix yields.

EthanP
  • 1,663
  • 3
  • 22
  • 27