Skip to content
Advertisement

Reverse Isometric Projection in Javascript

I have a function which converts some 3D coords (x, y, z) into a position in the screen (width, height), with an isometric perspective (true isometric, not dimetric).

JavaScript

So, for better clarification, here we have the blue lines, which represents the 2D Screen, and the black lines, which represents the 3D isometric space:

enter image description here

The above function works fine. If I invoke it like this, for example: Coords_3D_To_2D(15, -10, 5) it returns { w: 21.65, h: -7.5 }, which will be the point projected in the 2D screen (in this case, it would be outside screen, but that doesn’t matter).

So the projection 2D -> 3D seems to be working. But what I would like is to have a function which inverts that; it should receive some coords of the 2D Screen (w, h), and also some given value for the z-index, and return the corresponding 3D isometric point.

It should be something like this (here, I assigned a value of 5 for the z-index):

JavaScript

Advertisement

Answer

2 equations with 2 variables. Solvable.

JavaScript
User contributions licensed under: CC BY-SA
2 People found this is helpful
Advertisement