Place entities in a 45deg isometric fashion.
public this Crafty.isometric.size(Number tileSize)
Method used to initialize the size of the isometric placement.
Recommended to use a size values in the power of 2
(128, 64 or 32).
This makes it easy to calculate positions and implement zooming.
var iso = Crafty.isometric.size(128);
public this Crafty.isometric.place(Number x, Number y, Number z, Entity tile)
x
position to place the tiley
position to place the tilez
position or height to place the tileUse this method to place an entity in an isometric grid.
var iso = Crafty.isometric.size(128);
iso.place(2, 1, 0, Crafty.e('2D, DOM, Color').color('red').attr({w:128, h:128}));
public this Crafty.isometric.pos2px(Number x,Number y)
Object {left Number,top Number}
This method calculate the X and Y Coordinates to Pixel Positions
var iso = Crafty.isometric.size(128,96);
var position = iso.pos2px(100,100); //Object { left=12800, top=4800}
public this Crafty.isometric.px2pos(Number left,Number top)
Object {x Number,y Number}
This method calculate pixel top,left positions to x,y coordinates
var iso = Crafty.isometric.size(128,96);
var px = iso.pos2px(12800,4800);
console.log(px); //Object { x=-100, y=-100}
public this Crafty.isometric.centerAt(Number x,Number y)
This method center the Viewport at x/y location or gives the current centerpoint of the viewport
var iso = Crafty.isometric.size(128,96).centerAt(10,10); //Viewport is now moved
//After moving the viewport by another event you can get the new center point
console.log(iso.centerAt());
public this Crafty.isometric.area()
Object {x:{start Number,end Number},y:{start Number,end Number}}
This method get the Area surrounding by the centerpoint depends on viewport height and width
var iso = Crafty.isometric.size(128,96).centerAt(10,10); //Viewport is now moved
var area = iso.area(); //get the area
for(var y = area.y.start;y <= area.y.end;y++){
for(var x = area.x.start ;x <= area.x.end;x++){
iso.place(x,y,0,Crafty.e("2D,DOM,gras")); //Display tiles in the Screen
}
}