How to rotate an object relatively to camera's axes?

I’ve got an object that the user can click&rotate in all directions, including upside down. I’d like to make it work in such a way, that grabbing & dragging an object even multiple times in a row will always rotate it on the axes of our eyes, so to speak, and not on the axes of the now-rotated object.

Is that theoretically possible? Is this a job for quaternions? How could I approach this?

P.S. Actually, world axes or something like that could also work, my camera looking 90deg straight at the object.

https://threejs.org/examples/?q=transfo#misc_controls_transform

in this example press ‘E’ to go into rotate mode and drag on the outermost yellow ring is that what you want ?

1 Like

Yes! That is exactly what I need!

I skimmed through the code but I couldn’t pinpoint the part that’s responsible for it. Is it done with TransformControls.js?

yes , it’s part of transform controls and there’s some complex stuff going on

basic logic (not sure about the math)

  • there’s a invisible plane on the target mesh always looking at the camera
  • when we rotate the object it rotates along one of the local axis of this plane
1 Like