Rotate camera using quaternion

Questions
, ,
1

I’m trying to rotate a camera around a model using a quaternion:

However, I can’t get the camera to move at all.

I can see in the console log that the quaternion is changing, but no matter what vector values I use, the camera is unaffected.

What am I doing wrong? Thanks.

qr.setFromUnitVectors ( camera.position, endPosition )
      
camera.quaternion.slerp(qr, ease(u));

camera.quaternion.normalize();
2

Most likely controls.update() is preventing the camera rotation. I’d expect that the update picks camera’s position and control’s target and recalculates the camera orientation (thus ignoring the manually set quaternion).

To test whether this is true, remove the controls’ update, make the steps more (e.g. 300), and try again. I’d expect the camera will rotate.

BTW there might be other issues in the code, e.g. .setFromUnitVectors relies that the vectors are unit, but the method is fed with non-unit vectors. If the intention is to look the object from different points of views, changing rotation/quaternion is not sufficient, the position should also change. When slerping, maybe it is better to slerp from the initial to the final orientation, instead from the current to the final?

2 Likes
3

Thank you so much!

You are correct, it was controls.update() that prevented any camera movement. It makes a huge difference to at least be able to see the effect of code changes!

Fixes:

  • Added a function to calculate unit vectors.
  • Now slerping from initial to final orientation.

Progress: :slight_smile:

If the intention is to look the object from different points of views, changing rotation/quaternion is not sufficient, the position should also change.

This is the part where I am lost. I understand that quaternions describe rotation, not position. What you are saying makes total sense.

However, I have no clue how to even begin actually implementing this part:

  • How to combine position with the quaternion rotation?
  • Which vectors go into .setFromUnitVectors?
  • What to do with the position coordinates?
  • How to tell the camera to do that in three.js?

I really wish there were minimal tutorials for how to do fundamental things like this in three.js, for people who do not come from a computer graphics background and would appreciate more boilerplate code for getting projects started.

That’s almost what I’m trying to achieve with this is fiddle - is working out what is the simplest code needed to get the camera to rotate around the model from point A to point B.

Thanks again!