"Banking" the Camera

In my sample flight simulation, I would like to “bank” the camera along with the aircraft - for an “in cockpit” view. However, I understand that camera Z-rotation is not available in three.js.

From past experience, you would do this by moving and rotating everything around the aircraft (which is stationary) and then giving everything a final Z-rotation: you would Z-rotate each object and Z-rotate each object position. Is that what I will have to do here? Or is there a better way?

In the meantime, I have started the process by replacing the skybox with a cube and will see how that works.

May be this example will help you, there is a camera following the curve

1 Like

Yes, it looks like the example is doing what I will have to do - rotate the object. As I recall, I would save the pitch (up/down) and yaw (left/right) adjustments - since big changes would affect the computation of perspective - but I would make the bank adjustments temporary - because they do not affect perspective.

Another possible solution that I forgot to mention is to rotate the pixels on the screen. You might be able to get your graphics card to handle this. To avoid “clipping” problems, you would have to initially draw to a square screen that has the dimensions of the diagonal of your display… And, once done rotating, it would have to clip down to the screen dimensions - using something like a mask. But that solution is beyond my level of expertise - although I suspect that many modern graphics cards use this trick.

In case you are interested, here is what I have done:

Aircraft over Ocean

I created my own skybox (so no reflection yet). I zeroed out the aircraft rotation and, instead, rotated the skybox using essentially the aircraft values (pitch is reversed).
Rotating the position of the sun was a bigger challenge and ended up taking a full set of rotation equations. I have not tried rotating an external object yet, but the same principles should apply.

The bank rotation seems to “wander”, but that is only because I added a routine to change the heading of the aircraft as the aircraft banks - like a real airplane. If you remove that, the nose will stay fixed at the same point during the entire bank rotation.

I need to find a better skybox texture so that you can better see the aircraft movement against the ground.


looks awesome! May i suggest you to add some inertia to controls, might feel a bit better. So the movement does not stop once i stop pressing arrows.

1 Like

I was thinking the same thing.

Actually, this demo is only supposed to be a “display”, not a flight simulation. My flight simulation demo is here:
FM2 Wildcat

But once I added the full range of motion to this demo, it became hard not to think of it as a simulation. Like you, I was bothered that the “flight” controls were not behaving realistically. So I added a little lag at the front end when you first press the controls. And I agree with you that a little lag at the back end would help even more.

Here is the flight simulation demo:
FM2 Wildcat flight simulation
I need to make some minor fixes, but I was surprised to find that I am still getting 60fps.
This demo could also use some lag in the controls and in the camera tracking.

1 Like