Skip to main content

Documentation

CanvasTileEngine Docs

Build zoomable 2D maps, game boards, editors, minimaps, and dense grid UIs with a renderer-agnostic TypeScript engine. These docs cover the camera, drawing API, events, renderers, React bindings, and server snapshots.

Start readingPlaygroundGitHub

Packages

Documentation paths

Find the part of the engine you need

Start with the core model, then jump into renderer-specific guides, React bindings, event handling, or performance notes when your surface gets bigger.

Quick starts

Install the right packages and get a first rendered grid running in vanilla TypeScript or React.

Open guide

Camera & events

Use pan, zoom, hover, click, drag, and snapped world coordinates without rebuilding camera math.

Read events

Drawing & layers

Compose grids, rects, circles, images, text, paths, sprites, and overlays with predictable layer order.

View API

Renderer choices

Keep engine logic portable across Canvas2D, WebGL, React Native Skia, and headless server output.

Compare renderers

React bindings

Mount the engine declaratively, keep large item arrays stable, and wire draw components into app state.

Use React

Performance paths

Apply viewport culling, spatial indexing, static caches, and renderer batching for large tile scenes.

Tune scenes