Skip to content

Navigation controls

Zoom in, zoom out, and a compass land at top-right by default. That is controls: true, and you do not have to pass it.

live result
the code that produced it
import { Unmap } from "@unmap/sdk";

const unmap = new Unmap({
  key: "um_live_...",
  container: "map",
  center: [-114.0719, 51.0447],
  zoom: 11,
});

Pass an object to move them, or false to add none:

import { Unmap } from "@unmap/sdk";
 
const unmap = new Unmap({
  key: "um_live_...",
  container: "map",
  center: [-114.0719, 51.0447],
  controls: { position: "top-left" },
});
const unmap = new Unmap({
  key: "um_live_...",
  container: "map",
  center: [-114.0719, 51.0447],
  controls: false,
});

position is a MapLibre control corner: top-right, top-left, bottom-right, or bottom-left. Attribution stays on the map either way; it collapses to the ⓘ affordance.

The Quickstart covers the rest of the constructor.