# Isometric to Cartesian

Actionscript:
1. var centerX:Number=stage.stageWidth/2;
2. var centerY:Number=stage.stageHeight/2;
3. // 1 to 2 ratio
4. // try others 1 / 1.5 etc...
5. var theta:Number = Math.atan(1 / 2);
6.
7. var cosX:Number=Math.cos(theta);
8. var sinX:Number=Math.sin(theta);
9. var pnt:Point = new Point();
10.
11. function iso3D(x:Number, y:Number, z:Number):Point {
12.     pnt.x = centerX + (x-z) *  cosX;
13.     pnt.y = centerY -  (x+z) * sinX - y;
14.     return pnt;
15. }
16.
17. var p:Point = iso3D(0,0,0);
18.
19. graphics.beginFill(0x000000);
20. graphics.drawCircle(p.x, p.y, 2);
21.
22. // x axis positive
23. trace("x = red");
24. for (var i:int = 1; i<10; i++){
25.     graphics.beginFill(0xFF0000);
26.     p = iso3D(i*10, 0, 0);
27.     graphics.drawCircle(p.x, p.y, 2);
28. }
29.
30. // y axis positive
31. trace("y = green");
32. for (i= 1; i<10; i++){
33.     graphics.beginFill(0x00FF00);
34.     p = iso3D(0, i * 10, 0);
35.     graphics.drawCircle(p.x, p.y, 2);
36. }
37.
38. // z axis positive
39. trace("z = blue");
40. for (i= 1; i<10; i++){
41.     graphics.beginFill(0x0000FF);
42.     p = iso3D(0, 0, i * 10);
43.     graphics.drawCircle(p.x, p.y, 2);
44. }

The above code demos a conversion from isometric coordinates to cartesian coordinates. It draws out part of the x, y and z axis using the iso3D() function.

I've always faked isometric conversion by just tweaking numbers. A few years ago I created some strange isometric engines (here's another example). The other day when I wrote the isometric voxels snippet I just created the iso3D() function with a little trial and error. As you'll see it's not exactly the same as the one here. This new conversion is the result of some googling. The updated conversion is pretty close to the one that I wrote for the voxel post, but has one less multiplication... and a clearer place to control the scale ratio ...