Apply roll to ArcRotateCamera

Hello !

My goal is to apply a roll to my ArcRotateCamera when you drag’n’drop the middle mouse.

Just like the FlyCamera but with the middle button.

I have two ideas, but my first is to play with the camera.upVector, like in this topic

Here’s the playground : Babylon.js Playground

My problem is that I’m not good at math/geometry :no_mouth: (whereas I like them !), and I struggle to modify the upVector to get what I want.

Do someone have an idea, and could explain to me (and all the people landing on this thread !) ?

The camera should continue to behave “normally” after a roll, too !
Vertical and horizontal dragndrop should move the camera according to the new point of view (but it looks like it would do that …)

So far, I can roll the camera, but it looks that it rolls from the creation point of the camera …

Hey, turns out camera.upVector is not really like what I thought …

L38 : I’ve added two boxes created when you press the middle mouse.

upVector is not related to the camera, it’s related to the World…

Okay, I managed to roll by attaching a box, rotating it along the camera axis while camera is attached to the box !

But now, the panning (right-click) is broken…

Adding @PolygonalSun :slight_smile:

1 Like

It looks like it isn’t panning properly because the upvector isn’t getting updated. Since it’s accounted for it Global space, all panning is being done as though it’s still using the y-axis as the up vector. It looks like you got the behavior working in your previous iteration, unless I’m misunderstanding something. Also, is there any reason why you’re using the mesh as the parent, rather than the camera? I just wanted to make sure that I’m understanding things properly.

It looks like you got the behavior working in your previous iteration,

No, in the previous iteration, updating the upVector while the camera is at its spawning point does the job, but when you move it (and pan it), you’ll see that it is not the wanted behaviour.

It looks like it isn’t panning properly because the upvector isn’t getting updated.

In https://playground.babylonjs.com/#RDS489#3 and https://playground.babylonjs.com/#RDS489#4 I’m using a mesh as a helper for the camera rotation.

is there any reason why you’re using the mesh as the parent, rather than the camera?

Since I know how to rotate a box, making it the parent of the camera actually rolls the camera. But still, there are problems with panning with the upVector not changing.

Okay, third try :cry:

Attached a FlyCamera to the ArcRotateCamera

When the middle mouse is pressed, the FlyCamera takes control, and when the roll is done, the upVectorof the FlyCamera is copied to the ArcRotateCamera upVector.

But this doesn’t work well either …

Okay, I’ve found a quite brütal solution

On middle mouse dragndrop, rotate the whole world.
:metal:

We can see that lights don’t move, hence the shadows moving, but it can be fixed with a “root” element

3 Likes