How to move orthographic camera to follow target in isometric view

[etnbrd]

Hi,

I am developing a game with babylon.js, and I use an isometric view (so z coordinate, is actually pointing top left of the screen, and x bottom left) :

var zoom = 2;
var cameraPosition = new BABYLON.Vector3(5*zoom, 4.1*zoom, 5*zoom);

var scene = new BABYLON.Scene(engine);
var camera = new BABYLON.TargetCamera("camera1", cameraPosition, scene);
camera.mode = BABYLON.Camera.ORTHOGRAPHIC_CAMERA;
camera.orthoTop = 2.5 * zoom;
camera.orthoBottom = -2.5 * zoom;
camera.orthoLeft = -5 * zoom;
camera.orthoRight = 5 * zoom;

Therefore, when the player wants to go up (velocity.top), the controlled mesh should increment both z, and x, which results in the following equations :

if (player.velocity.top !== 0 && player.velocity.left !== 0)
  var d = 0.7071; // Cos(45°)
else
  var d = 1;

player.position.z += Math.sign(player.velocity.top - player.velocity.left) * d * t;
player.position.x += Math.sign(player.velocity.top + player.velocity.left) * d * t;

All this seems to be working fine.

Now, I would like the orthographic camera to follow the player when he is moving.

I can't make the camera target the player, as it breaks the isometric view : the camera doesn't move to follow the player, it rotates, and as the angle of the camera changes, the isometric view breaks.
Instead, I think I need to move the bounding box of the orthographic camera to be centered on the player position. But because the camera is orthographic, the bounding box doesn't seem to be related to the same coordinates as the player : the same way position.z is an arbitrary combination of velocity.top and veloctiy.left, orthoTop should be the inverse combination of position.z and position.x.

So instead, my idea was to increment the bounding box by the same amount the player moves (as the velocity is in the same direction than the bounding box).

By tweaking the values, I came up with this approximate solution, which I have a hard time to understand.

if (player.velocity.top !== 0 && player.velocity.left !== 0)
  var d = 0.35; // Cos(45°)³
else
  var d = 1;

camera.orthoTop -= Math.sign(player.velocity.top) * d * t * .7;
camera.orthoBottom -= Math.sign(player.velocity.top) * d * t * .7;
camera.orthoLeft -= Math.sign(player.velocity.left) * d * t * 1.4;
camera.orthoRight -= Math.sign(player.velocity.left) * d * t * 1.4;

It is approximate, because it only minimizes the error of movement between the camera and the mesh. But if the player goes one direction long enough, it will eventually go out of the screen.

I am pretty sure there is an explanation for all this, but can't find it.
What is the correct way to make an orthographic camera follow a target in an Isometric view ?

Thanks,

 

[Valik]

Hi,

i dont know the correct way with the ORTHOGRAPHIC_CAMERA but i also played around with the iso view. Check this pg:

https://playground.babylonjs.com/#4NUAEA

it is not that perfect, changing the camera Position watching the target causes the normal up-down-left-right moving to right-up right-down etc. i corrected it but it still seems not to work like intended.