1

I'm trying to rotate a mesh loaded into an Object3D using OBJMTLLoader.

var obj = new THREE.Object3D();
// loading and stuff

obj.rotation.y += 0.1; //inside the update function

This works as it should, but only for y and z axes. Using the same code, but for the x axis yields the same result as rotating it around the z axis, but clockwise instead of counterclockwise.

Unfortunately, I need to rotate it around the x axis.

var xAxis = new THREE.Vector3(1,0,0);
obj.rotateOnAxis( xAxis, 0.1 );

This does rotate the object around the x axis.

However, I want to tween the rotation of the object, so I need a way to explicitly change the angle an object is rotated by, instead of rotating it for a specific amount.

Any ideas why obj.rotation.y and obj.rotation.z work properly, but obj.rotation.x doesn't?

ivan
  • 51
  • 1
  • 6
  • putting a live example up e.g. as a jsfiddle would help greatly in figuring this out. sound very strange so far but is probably something simple. – antont Apr 09 '15 at 17:24
  • @antont thanks, but I figured it out. – ivan Apr 09 '15 at 18:44
  • thanks for sharing the solution, makes sense now and I'm glad that learned how such a situation can happen. – antont Apr 10 '15 at 11:09

1 Answers1

3

Upon loading the mesh (before trying to rotate it around the x axis), I rotated it by 90 degrees around the y axis. Because of the default Euler order (which is XYZ), the local axes no longer corresponded to the world axes.

obj.eulerOrder = 'YXZ';

Using the above line of code before rotating the mesh around the y axis solved the problem.

A pretty good explanation of Euler order can be found here.

Community
  • 1
  • 1
ivan
  • 51
  • 1
  • 6