Skip to main content

CanvasGlobe: interactive maps you can ship today

Interactive 3D globe and world map on a plain 2D canvas. Zero dependencies, zero network calls, ~121 KB gzipped: drop it in a <script> tag or import it in React.

Example data. Drag the globe. Scroll to zoom. Hover a marker.

Zero dependencies

No WebGL, no D3, no tiles, no API keys. Country geometry ships inside the package.

Interaction

Drag with momentum, scroll to zoom, pinch, hover, click, and use keyboard controls.

Ten presets

Dot-matrix hologram, neon, blueprint HUD, printed atlas. Every piece composes.

Country canvas

Play an image, GIF or video inside a country's outline.

Knows the viewer

Places them from their time zone. No permission prompt, no network call.

One renderer, many stories

Start with a ready-made look, then combine themes, routes, markers, charts, effects, flat-map projections, and export tools without replacing the renderer.

Explore every template in the playground
CanvasGlobe examples showing multiple globe themes, routes, markers, and geographic data visualizations
Real CanvasGlobe renders from the public examples and playground.

Two lines to a globe

import { createGlobe } from "canvas-globe";

createGlobe(document.querySelector("#globe"), {
  licenseKey: "your-license-key",
  markers: [{ lat: 23.03, lon: 72.58, count: 12, emoji: "🧑‍🎨", live: true }],
});
Install it →

Evaluating alternatives? Read the JavaScript globe library comparison.

Commercial licensing

One small price. Every project ahead.

Pay $9.99 once for unlimited projects, unlimited developers, and lifetime updates. One commercial license for your websites, apps, SaaS, and internal tools.

Around the web

Read the story or try CanvasGlobe somewhere else

These pages offer another way to understand the project, from the story behind its Canvas 2D renderer to a live notebook you can use without installing anything.

See every article, demo, and directory listing

Talk to a real person

Live human support. Choose what you need help with.