Skip to main content
Deno 2 is finally here 🎉️
Learn more

React Isometric Tilemap

Latest version LGPL 3.0 Deno Doc (API references) GitHub Actions

A library for displaying tilemaps and handling events on it. See also the demo app first!

It was originally written by Ramiro Rojo in JavaScript. This project forks it and then rewrote it in TypeScript and let it work on Deno and Aleph.js.

How to use

Import this library in your code:

// The map is the basic container, the tile is each square
import IsometricMap, {
  IsometricTile
} from "https://deno.land/x/react_isometric_tilemap/mod.ts";

Now you can create your own map with it:

const MyMap = () => {
  <IsometricMap mapWidth={1} mapHeight={1} tileSize={32} slabSize={8}>
    <IsometricTile x={0} y={0} z={3} />
  </IsometricMap>;
};

Please refer for the documentation for more details about the components provided. See also the source code of the demo app in demo/ directory.