Karteneditor anhängen

Mounte den Kaleidr-Editor in deiner Seite und ermögliche Benutzern, eine Karte zu gestalten.

Erfordert einen Publishable Key mit design-Scope auf Pro oder höher. Der Origin deiner Seite muss in der Allowlist des Schlüssels stehen und über HTTP(S) ausgeliefert werden; deine CSP muss 'wasm-unsafe-eval' (MapLibre) sowie die Tile-/Vendor-Hosts erlauben — siehe API-Schlüssel erhalten und Content Security Policy.

<div id="editor" style="height:640px"></div>
<script src="https://cdn.kaleidr.com/embed/v1/kaleidr.js"></script>
<script>
  const handle = Kaleidr.mount('#editor', {
    product: 'editor',
    publishableKey: 'kld_pk_live_…',  // design scope
    styleId: 'kaleidr-night',         // catalog basemap id or full style URL
    center: [-0.12, 51.5],
    zoom: 11,
    pitch: 35,
    bearing: -15,
  });
  // later: handle.destroy();
</script>

Der Editor erstellt innerhalb von #editor seine eigene MapLibre-Karte. Seine Map-Design- Hilfen (Dataset analysieren, Layer erstellen) rufen die design-Oberfläche der Plattform mit deinem Schlüssel auf und rechnen den design-Scope ab. Übergib styleId (eine Katalog-Basemap-ID wie kaleidr-night oder eine vollständige Style-URL), um mit einer Basemap zu beginnen.

Für eine Dev-Basemap übergib tileBase: 'https://tile-dev.kaleidr.com' — Katalog- Style-IDs werden dann dagegen statt gegen das Produktionssystem tile.kaleidr.com aufgelöst.

Siehe Editor attach.