Canvas Tile Engine
v0.x.xMIT License

Canvas Tile Engine

High-performance, platform agnostic tile engine for interactive 2D maps and visualizations.

$ npm i @canvas-tile-engine/core @canvas-tile-engine/renderer-canvas
x: 120, y: 80

Ready to build?

Explore the docs or try it live in the playground.

Features

Everything you need to build performant, interactive canvas applications.

High Performance

Render thousands of objects with smooth 60fps. Optimized for large maps and complex visualizations.

Interactive

Built-in pan, zoom, drag, and click events. Automatic coordinate transformations handled for you.

Layered Architecture

Multiple rendering layers for organized map editing. Draw shapes, images, and text with ease.

TypeScript First

Fully typed API with excellent IntelliSense support. Great developer experience out of the box.

Lightweight

Small bundle size with zero external dependencies. Just the essentials, nothing more.

Spatial Indexing

R-Tree based spatial indexing and viewport culling. Only render what's visible on screen.

Ecosystem

Modular architecture designed to be platform agnostic. Use the core engine with any renderer on any platform.

Core

Available

Core

@canvas-tile-engine/core

Platform agnostic calculation engine. Handles all logic, coordinates, and state.

$ npm i @canvas-tile-engine/core

Renderers

Available

Canvas Renderer

@canvas-tile-engine/renderer-canvas

HTML5 Canvas renderer for web browsers.

$ npm i @canvas-tile-engine/renderer-canvas
Soon

Skia Renderer

@canvas-tile-engine/renderer-skia

High-performance Skia graphics engine renderer.

$ npm i @canvas-tile-engine/renderer-skia

Frameworks

Available

React

@canvas-tile-engine/react
canvas-renderer

Hooks and components for React 18+ applications.

$ npm i @canvas-tile-engine/react
Soon

React Native

@canvas-tile-engine/react-native
skia-renderer

Native mobile support for iOS and Android.

$ npm i @canvas-tile-engine/react-native

Examples

Explore live demos and source code to see the tile engine in action.

Game Map

A vanilla JavaScript implementation demonstrating core tile engine functionality with interactive map rendering.