DKOZAR.COM-->TUTORIALI_______________________________________________________________________________

Tutoriali

Moj prvi tutorial na kirupa.com!

http://kirupa.com/developer/actionscript/isometric_transforms.htm

Odlučio sam napisati seriju tutoriala o izometriji za Kirupa.com (meni omiljeni Flash resource) zbog toga što na netu nema baš puno dobrih članaka na tu temu (a oni koji postoje navode programera na krivi put).

Prva tri tutoriala zvat će se:

1) Isometric Transformations
2) Isometric Hit Testing
3) Push Flags System

Prvi tutorial govori o:

- izometrijskoj transformaciji pomoću koje 3d koordinate prebacujemo iz izometrijskog u kartezijev (2d) koordinatni sustav
- crtanju u izometriji
- micanju objekata u izometriji

Isometric Hit Testing

Drugi tutorial na kirupa.com:

http://kirupa.com/developer/actionscript/isometric_hittest.htm

Tutorial objašnjava overriding originalne hitTest funkcije u svrhu ispitivanja sudara objekata u izometriji.

Reversed isometric transformations

A few people asked me how to get isometric (3d) coordinates from the mouse click (2d).
The answer is: you have to assume that one of the x, y or z coordinates is fixed.

Original equations:

xFla = (x-z)*Math.cos(0.46365) + xOrigin
yFla = yOrigin - y - (x+z)*Math.sin(0.46365)

Legend:

xOrigin, yOrigin ... on screen coordinates of the isometric (0, 0, 0)
x, y, z ... isometric coordinates
xFla, yFla ... on screen coordinates transformed from isometric coordinates

-----------------------------------------------

You have to assume which coordinate will be fixed before transforming your equations. So, let's assume y is fixed, because it represents the "height" of the room. We have:

y = fixed
x, z -> variables

-----------------------------------------------
xFla - xOrigin = (x-z)*Math.cos(0.46365)
yFla + y - yOrigin = - (x+z)*Math.sin(0.46365)
-----------------------------------------------
(xFla - xOrigin)/Math.cos(0.46365) = (x - z)
(yFla + y - yOrigin)/Math.sin(0.46365) = - (x + z)
-----------------------------------------------
(xFla - xOrigin)/Math.cos(0.46365) = x - z
(yFla + y - yOrigin)/Math.sin(0.46365) = - x - z
-----------------------------------------------
1) sum these equations to get z
2) substract them to get x
-----------------------------------------------
1) sum
(xFla - xOrigin)/Math.cos(0.46365) + (yFla + y - yOrigin)/Math.sin(0.46365) = -2z
z = - ((xFla - xOrigin)/Math.cos(0.46365) + (yFla + y - yOrigin)/Math.sin(0.46365))/2

2) substract
(xFla - xOrigin)/Math.cos(0.46365) - (yFla + y - yOrigin)/Math.sin(0.46365) = 2x
x = ((xFla - xOrigin)/Math.cos(0.46365) - (yFla + y - yOrigin)/Math.sin(0.46365))/2
-----------------------------------------------
Flash functions:

// transforms screen xFla,yFla coordinates into x isometric 3d coordinate, assuming that y is fixed
x = function (xFla, yFla, y) {
return ((xFla - xOrigin)/Math.cos(0.46365) - (yFla + y - yOrigin)/Math.sin(0.46365))/2
};

// transforms screen xFla,yFla coordinates into z isometric 3d coordinate, assuming that y is fixed
z = function (xFla, yFla, y) {
return (- ((xFla - xOrigin)/Math.cos(0.46365) + (yFla + y - yOrigin)/Math.sin(0.46365)))/2
};

-----------------------------------------------
So, using these 2 equations and putting xFla, yFla and y you get the remaining x and z Isometric coordinates.
xFla and yFla received from the mouse click and y coordinate is fixed (e.g. y = 0 -> room floor) or received from another controller (e.g. keyboard UP/DOWN sets the y).

Tip: when changing the y coordinate with UP/DOWN cursor keys, you could animate some semi-transparent "floor-shaped" surface moving up&down in the room and give a feedback to the user.

Of course, you should optimize these equations by replacing values like Math.sin(0.46365) with calculated ones, so it won't be calculated on every onEnterFrame event..

Optimized:

// transforms screen xFla,yFla coordinates into x isometric 3d coordinate, assuming that y is fixed
x = function (xFla, yFla, y) {
return ((xFla - xOrigin)/0.89443 - (yFla + y - yOrigin)/0.44721)/2
};

// transforms screen xFla,yFla coordinates into z isometric 3d coordinate, assuming that y is fixed
z = function (xFla, yFla, y) {
return (- ((xFla - xOrigin)/0.89443 + (yFla + y - yOrigin)/0.44721))/2
};