I'm working on an isometric game for fast browsers that support <canvas>, which is great fun. To save information of each tile, I use a two-dimensional array which contains numbers representing tile IDs, like:

var level = [[1, 1, 1, 2, 1, 0],
             [0, 1, 1, 2, 0, 1],
             [0, 1, 1, 2, 1, 1]];

var tiles = [
    {name: 'grass',  color: 'green'},
    {name: 'water',  color: 'blue'},
    {name: 'forest', color: 'ForestGreen'}
];

So far it works great, but now I want to work with heights and slopes like in this picture: alt text http://harmen.no-ip.org/isometrictiles.png

For each tile I need to save it's tile ID, height and information about which corners are turned upward.

I came up with a simple idea about a bitwise representation of all four corners, like this:

1011 // top, bottom and left corner turned up

My question is: what is the most efficient way to save these three values for each cell? Is it possible to save these three values as one integer?

javascript isometric
Edit
Report