https://github.com/felipeizolan/phaser-isometric-engine
🥧 phaser-isometric-engine (grid-based)
https://github.com/felipeizolan/phaser-isometric-engine
gamedev isometric isometric-game phaser typescript
Last synced: 3 months ago
JSON representation
🥧 phaser-isometric-engine (grid-based)
- Host: GitHub
- URL: https://github.com/felipeizolan/phaser-isometric-engine
- Owner: FelipeIzolan
- License: mit
- Created: 2024-02-26T07:39:55.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2024-02-28T09:55:50.000Z (about 1 year ago)
- Last Synced: 2025-01-31T05:33:18.959Z (3 months ago)
- Topics: gamedev, isometric, isometric-game, phaser, typescript
- Language: TypeScript
- Homepage:
- Size: 16.6 KB
- Stars: 4
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 🥧 phaser-isometric-engine
## 🚀 Getting Started
```
git clone https://github.com/FelipeIzolan/phaser-isometric-engine.git
cd phaser-isometric-engine
npm i && npm start
```
- Configure the canvas in **main.ts**.
- Configure the static's field inside grid in **grid.ts** .
- Add **tiles** and **objects** sprites in **public/tiles** and **public/objects**.
- Load and create **tiles** and **objects** in **game.ts**.
## 📄 Documentation
**Grid**
```typescript
tile_id: number //<- Tile id counter.
object_id: number //<- Object id counter.
anims: Set //<- Set of sprites that has animation.
offsets: Map //<- Y-offset Map of objects-sprite.
loadTile(src: string, fw?: number, fh?: number) //<- Load the entire sprite or a frame of the sprite. (Tile)
loadObject(src: string, fw?: number, fh?: number) //<- Load the entire sprite or a frame of the sprite. (Object)
create() //<- Create the tiles on the grid.
createTileAnim(id: number, framerate?: number, repeat?: number, repeat_delay?: number) //<- Create an animation. (Tile)
createObjectAnim(id: number, framerate?: number, repeat?: number, repeat_delay?: number) //<- Create an animation. (Object)
getTile(x: number, y: number) //<- Get tile by x and y.
getTileByCartPos(x: number, y: number): Tile | null //<- Get tile by cartesian position.
getTileByIsoPos(x: number, y: number): Tile | null //<- Get tile by isometric position.
// Look engine/types.ts
setTile(x: number, y: number, tile: OptionalTileSetter) //<- Set tile.
setGrid(tiles: OptionalTileSetter[][]) //<- Set grid.
```
**Tile**
```typescript
x: number //<- Grid tile x.
y: number //<- Grid tile y.
z: number //<- Grid tile z.
object: number | null //<- Grid tile object.
worldX: number //<- Tile world position x.
worldY: number //<- Tile world position y.
depth: number //<- Tile depth.
setTile(id: number) //<- Set tile by id.
setObject(id: number) //<- Set object by id.
set(setter: OptionalTileSetter) //<- Set (or not) a tile and object.
```
## 📜 License
- [phaser-isometric-engine](https://github.com/FelipeIzolan/phaser-isometric-engine) - MIT
- [phaser](https://github.com/phaserjs/phaser) - MIT
- [vite](https://github.com/vitejs/vite) - MIT
- [tiny-blocks](https://dani-maccari.itch.io/tiny-blocks-isometric-pixel-assets)