Zum Hauptinhalt springen

Editor

Der Editor integriert Kaleidrs Kartenbearbeitungswerkzeuge in Ihre Seite: eine Kaleidr-Basiskarte und Funktionen zum Hinzufügen von Text, Bildern, Markierungen und Pop-ups sowie zum Ändern der Kartengestaltung.

Beachten Sie den Funktionsumfang vor der Entwicklung

Der eingebettete Editor arbeitet innerhalb der Seite und hält alle Änderungen in deren Speicher. Aus dem Embed wird nichts gespeichert, exportiert oder veröffentlicht, und Ihre Seite erhält bei Änderungen keinen Callback. Beim Neuladen der Seite oder Zerstören des Editors gehen die Änderungen verloren. Damit lässt sich kein Veröffentlichungsablauf für Karten anbieten. Erstellen Sie Karten, die gespeichert, geteilt und eingebettet werden sollen, in Kaleidr Studio und zeigen Sie sie mit Viewer an.

Auf einen Blick​

FrageAntwort
Was brauche ich?Einen veröffentlichbaren Schlüssel (kld_pk_live_…) mit der Berechtigung design. Neue Schlüssel enthalten sie standardmäßig.
Welcher Tarif?Alle Tarife, einschließlich Free.
Wie wird er dargestellt?Direkt auf Ihrer Seite, nicht in einem iframe. Karte und Editorfenster sind Elemente Ihres Dokuments.
Wo werden Änderungen gespeichert?Nirgendwo. Sie verbleiben bis zum Neuladen der Seite oder zum Zerstören des Editors im Arbeitsspeicher.
Kann mein Code die Änderungen lesen?Nein. Es gibt kein Änderungsereignis, keinen Export und keinen Zugriff auf das Kartenobjekt.
Wie viele pro Seite?Einen.

Kleinste Einbindung​

<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_…',
});
</script>

Das Zielelement benötigt eine Höhe. Der Editor füllt es aus.

Funktionen des eingebetteten Editors​

Die Werkzeugleiste des Editors hat acht Einträge:

  • Text: Überschriften und Fließtext auf der Karte.
  • Bild: Bilder auf der Karte.
  • Markierung: Markierungen an einem Standort.
  • Pop-up: Pop-ups an einem Standort.
  • Hintergrund: die Fläche hinter der Karte.
  • Ebene: karteneigene Ebenen wie Beschriftungen, 3D-Gebäude, Licht und Gelände.
  • Design: Basiskartenelemente, Elementkategorien oder Regionen auswählen und umgestalten.
  • Legende: Einstellungen für Bezeichnungen und Legenden.

Nicht enthaltene Funktionen​

Folgende Bestandteile von Kaleidr Studio sind im Embed nicht verfügbar:

  • Die Daten-Registerkarte: Es können keine Datensätze hochgeladen werden; die Werkzeuge zur Gestaltung hochgeladener Daten finden daher keine Daten vor.
  • Der Designkatalog von Studio mit Beispielkarten und Stilarten.
  • Das KI-Panel.
  • Die 3D-Modellbibliothek.
  • Teilen und Veröffentlichen.
  • Projekte: keine Liste gespeicherter Karten, keine Öffnen- oder Speichern-Funktion.
  • Anmeldung: Das Embed verwendet Ihren Schlüssel, nicht das Kaleidr-Konto einer Person.

Funktionsweise​

  1. Das SDK tauscht Ihren veröffentlichbaren Schlüssel gegen eine kurzlebige Sitzung aus. Dabei werden der Schlüssel, seine Berechtigung design und der Ursprung Ihrer Seite geprüft.
  2. Gleichzeitig lädt das SDK das Editor-Bundle editor.js von https://cdn.kaleidr.com. Es ist mehrere Megabyte groß und wird nur beim Einbinden eines Editors geladen. Der Editor startet, sobald beide Vorgänge beendet sind.
  3. Der Editor erstellt im Zielelement eine Karte und lädt die Basiskarte von https://tile.kaleidr.com. Die Anfragen nach Stil, Sprites und Schriftarten enthalten Ihren veröffentlichbaren Schlüssel, damit der Basiskartenserver Ihre Seite erkennt. Das Sitzungstoken erscheint niemals in einer URL.
  4. Die Editorfenster werden über der Karte innerhalb des Zielelements angezeigt.

Da alles auf Ihrer Seite läuft, muss die Content Security Policy mehr Quellen erlauben als bei Viewer oder Tile. Die genauen Direktiven stehen unter Content Security Policy.

Was Ihre Seite steuern kann​

  • Basiskarte auswählen mit styleId, etwa kaleidr-night.
  • Anfangsansicht einstellen mit center, zoom, pitch und bearing.
  • Kamera später bewegen mit handle.setCamera(...).
  • Markengestaltung übernehmen mit theme, einem Objekt mit 17 benannten Schlüsseln wie brandColor und fontPrimary.
  • Editor entfernen mit handle.destroy().

Grenzen​

  • Nichts wird gespeichert, exportiert oder veröffentlicht; es gibt keinen Änderungs-Callback.
  • Der Handle gibt keinen Zugriff auf die Karte. Eigene Ebenen lassen sich nicht ergänzen und gezeichnete Inhalte nicht auslesen.
  • Basiskarte und Thema werden beim Einbinden festgelegt. Um sie zu ändern, müssen Sie den Editor zerstören und neu einbinden; dabei gehen Änderungen verloren.
  • Es ist nur ein Editor pro Seite erlaubt.
  • Designwerte gelten während der Editor eingebunden ist für das gesamte Dokument und werden danach wiederhergestellt.
  • Ihr Code erhält kein Bereitschafts- oder Fehlersignal. Fehler erscheinen in der Browserkonsole.

Nächste Schritte​