1

I want to rotate the X and Y axis like in the following picture:

enter image description here

Scenario is like this:

!! In this scenario the Z axis is the 3D up and down axis and does not server any importance !!

At the start of the scene you are a 3D character looking at Y. You can move left and right along the X axis with the following code:

camera.position.x += 1; OR camera.position.x -= 1;

You can also turn your camera and look towards another point. This will be point Y1 in picture 2. I rotate the camera object via the following code:

camera.rotation.z += 1; OR camera.rotation.z -= 1; //Normally Z is Y.

Now when you try to move along the X axis, you will still move along the original X1 axis instead of the new X2 axis.

My question is, how do I make the object move along the new X2 axis instead of the old original X1 axis?

Paul de Koning
  • 422
  • 1
  • 5
  • 16
  • Three.js makes direction vectoring easy. See the accepted answer here. http://stackoverflow.com/questions/38052621/moving-the-camera-in-the-direction-its-facing-with-threejs – Radio Mar 03 '17 at 21:51
  • Thanks, how do I mode it left/right though? I can't seem to figure that out... – Paul de Koning Mar 03 '17 at 23:09

1 Answers1

3

Suggest you know about Object Space and World Space, you can look this book 3D Math Primer for Graphics and Game Developmen

Actually, camera.position.x += 1 makes the camera translation along World Space X axis, at the beginning, the World Space was same as Object Space, when you rotated the camera with camera.rotation.z += 1, the Object Space was changed, you want to translate along Object Space axis, you should use camera.translateX(0.1). the camera would translate in Object Space.

Craig.Li
  • 1,336
  • 10
  • 17