# ef-infinite-canvas

> An infinite version of the html canvas

Latest version **0.6.11** (published 2026-07-29) · MIT license · 0 weekly downloads

## Install

```sh
npm install ef-infinite-canvas
pnpm add ef-infinite-canvas
yarn add ef-infinite-canvas
bun add ef-infinite-canvas
```

## Health

**Score 65/100 (B)** — status: active.

Positive: has types; esm support; no vulnerabilities; high maintenance score; high quality score.

Warnings: low downloads; pre 1.0.

## Facts

| | |
|---|---|
| Version | 0.6.11 |
| Published | 2026-07-29 |
| First published | 2020-08-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 398.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 192 |
| Author | Emile Fokkema |
| Maintainers | emilefokkema |
| Keywords | canvas, infinite |

## Links

- npm: https://www.npmjs.com/package/ef-infinite-canvas
- Repository: https://github.com/emilefokkema/infinite-canvas
- Homepage: https://infinite-canvas.org/
- Issues: https://github.com/emilefokkema/infinite-canvas/issues
- npm.io page: https://npm.io/package/ef-infinite-canvas

## Alternatives

- [exif-parser](https://npm.io/package/exif-parser.md) — 3.8M weekly downloads
- [vite-plugin-compression](https://npm.io/package/vite-plugin-compression.md) — 569.5K weekly downloads
- [pica](https://npm.io/package/pica.md) — 442.4K weekly downloads
- [@reportportal/client-javascript](https://npm.io/package/@reportportal/client-javascript.md) — 408.8K weekly downloads
- [@tldraw/state](https://npm.io/package/@tldraw/state.md) — 316.0K weekly downloads

## Recent versions

- 0.6.11 (latest) — 2026-07-29
- 0.6.10 — 2026-03-29
- 0.6.9 — 2025-08-17
- 0.6.8 — 2025-05-17
- 0.6.7 — 2024-10-05
- 0.6.6 — 2024-05-14
- 0.6.5 — 2024-04-13
- 0.6.4 — 2024-02-23
- 0.6.3 — 2024-01-19
- 0.6.2 — 2023-09-08
- 0.6.1 — 2023-04-15
- 0.6.0-alpha — 2023-01-18
- 0.5.7-alpha — 2022-12-16
- 0.5.6-alpha — 2022-11-28
- 0.5.5-alpha — 2022-09-10
- … 8 more at https://npm.io/package/ef-infinite-canvas/versions

## README

# InfiniteCanvas

[![npm version](https://badge.fury.io/js/ef-infinite-canvas.svg)](https://badge.fury.io/js/ef-infinite-canvas)

[project page](https://infinite-canvas.org)

## About

`InfiniteCanvas` wraps an HTML5 `<canvas>` element and allows the user to zoom, pan and rotate the contents of the canvas. Content can be drawn on the canvas using the `CanvasRenderingContext2D` that is returned by `InfiniteCanvas`'s `getContext` method.

```js
var canvasElement = document.getElementById("canvas");
var infiniteCanvas = new InfiniteCanvas(canvasElement);
var context = infiniteCanvas.getContext("2d");
```

`InfiniteCanvas` has no dependencies that are not `devDependencies`.

## Installation

Include `InfiniteCanvas` in your web page:

```html
<script src="https://cdn.jsdelivr.net/npm/ef-infinite-canvas@0.6.11/dist/infinite-canvas.umd.cjs"></script>
```

or install it using npm:

```
npm install ef-infinite-canvas
```

## Build
```
npm run build
```

## Test

Testing `InfiniteCanvas` happens on two levels. One level is the `jest` tests that are run using
```
npm run test
```
The other level of testing happens by (first running `npm run build` and then) running
```
npm run test-e2e
```
which will start a server that serves pages in which `InfiniteCanvas` is used, and which will then run `jest` tests that use [Puppeteer](https://pptr.dev/) to manipulate those pages and [`jest-image-snapshot`](https://github.com/americanexpress/jest-image-snapshot#readme) to compare screenshots.

## Local development

First run `npm run dev-app:build` once. Then `npm run dev` will run an app that displays all manner of use cases for InfiniteCanvas, served by Vite.


*Even though not much has happened in this repository lately, I have not forgotten about it. Quite to the contrary, there are a lot more features I'm planning to add in the not-too-distant future.*

---
_Source: https://npm.io/package/ef-infinite-canvas · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
