Engines

TacticalDraw talks to a map only through a MapAdapter — each supported engine ships a thin adapter package. The same TacticalDraw code runs on all of them; the only line that differs is which adapter you construct.

Pick an engine below and draw. Each engine's library is loaded lazily, only when you select it.

AmbushMain AttackFortified AreaBlockLoading map…

The toolbar above is the same component for every engine. The only per-engine code is the one line that wraps the native map:

new MapLibreAdapter(map); // maplibre-gl Map
new OpenLayersAdapter(map); // ol/Map
new LeafletAdapter(map); // leaflet Map

Everything after that — new TacticalDraw(adapter), td.draw(...), td.render(...) — is identical. See the Quick start for the full draw walkthrough.

Install

Each adapter declares its engine as a peer dependency — install it alongside the one engine you already use, never the other two.

MapLibre GL

npm install @orbat-mapper/tactical-draw @orbat-mapper/tactical-draw-adapter-maplibre maplibre-gl

import { MapLibreAdapter } from "@orbat-mapper/tactical-draw-adapter-maplibre";
import maplibregl from "maplibre-gl";

const map = new maplibregl.Map({ container, style, center, zoom });
map.on("load", () => {
  const td = new TacticalDraw(new MapLibreAdapter(map));
});

OpenLayers

npm install @orbat-mapper/tactical-draw @orbat-mapper/tactical-draw-adapter-openlayers ol

import { OpenLayersAdapter } from "@orbat-mapper/tactical-draw-adapter-openlayers";
import OLMap from "ol/Map";

const map = new OLMap({ target, layers, view });
const td = new TacticalDraw(new OpenLayersAdapter(map));

Leaflet

npm install @orbat-mapper/tactical-draw @orbat-mapper/tactical-draw-adapter-leaflet leaflet

import { LeafletAdapter } from "@orbat-mapper/tactical-draw-adapter-leaflet";
import L from "leaflet";

const map = L.map(target, { center, zoom });
const td = new TacticalDraw(new LeafletAdapter(map));

Bring your own engine

No adapter for your map library? MapAdapter is a small, type-only contract and BaseMapAdapter does most of the work — implement the engine-specific primitives and TacticalDraw runs on it unchanged.