https://github.com/basementuniverse/tily

A simple tile engine with Javascript and Canvas.
https://github.com/basementuniverse/tily

canvas game-engine tile tile-engine

Last synced: 21 days ago
JSON representation

A simple tile engine with Javascript and Canvas.

• Host: GitHub
• URL: https://github.com/basementuniverse/tily
• Owner: basementuniverse
• License: mit
• Created: 2017-01-26T22:45:50.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2022-12-06T22:01:56.000Z (about 2 years ago)
• Last Synced: 2024-04-15T14:32:50.774Z (9 months ago)
• Topics: canvas, game-engine, tile, tile-engine
• Language: JavaScript
• Size: 1.71 MB
• Stars: 5
• Watchers: 2
• Forks: 2
• Open Issues: 11
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# ![](docs/images/tily.svg) Tily

A basic font-based tile engine.

### Features

- Uses Canvas to render tiles.

- Switch between buffers with a configurable fade transition.

- Each tile is a string character or multiple characters drawn on top of each other, so rendering is independent of resolution and pixel-ratio.

- Can use Web Fonts and Icon Fonts for custom icons. I recommend using [Web Font Loader](https://github.com/typekit/webfontloader).

- Pan and zoom the camera for scrolling buffers.

- Tiles can have transitions and animations for movement, scaling and rotation amongst other things.

- Cell-loading for infinite or procedurally-generated buffers.

### Setting it up

Just load `tily.min.js` in your page and create a `Tily.Main` instance, passing in the canvas element on which you want to render as an argument, like so:

```html

var tily = new Tily.Main(document.querySelector("#tily-canvas"));

```

[Documentation](https://basementuniverse.github.io/tily/index.html)

### Demos

- [Moving a player around the screen](https://basementuniverse.github.io/tily/demos/movingplayer/index.html)

- [A really big buffer](https://basementuniverse.github.io/tily/demos/largebuffer/index.html)

- [Lots of animations and transitions](https://basementuniverse.github.io/tily/demos/animations/index.html)

- [An infinite procedurally-generated buffer](https://basementuniverse.github.io/tily/demos/proceduralbuffer/index.html)

- [Map Painter](https://basementuniverse.github.io/tily/demos/mappainter/index.html)