iso

A JavaScript library that lets you draw isometric 3D like images using isometric blocks.

window.onload = function() {

	iso = new Iso('isoCanvas', 53);

	iso.draw(-1, 0, 0, 'grass.png');
	iso.draw(0, 0, 0, 'grass.png');
	iso.draw(1, 0, 0, 'grass.png');
	
}

Here's a screen shot of an example image drawn on an HTML page using this library.

iso uses a 3D coordinate system using the x, y, and z axis. (0, 0, 0) is the center point. Here's a graphical drawing of the coordinate system.

Each block is actually a png image file. You can use various image files to represent different types of tiles such as glass, dirt, rock, brick, etc.

I've now tested the library in FireFox 8.0 and Chrome 15 (both under Linux). But I imagine it works with most current browsers and operating systems. The HTML 5 canvas element is new to HTML 5, however, so older browsers do not support it.

The iso files are hosted on github.

This source code is distributed under the MIT License.