Editor-Referenz

product="editor" integriert die Kartenbearbeitungswerkzeuge von Kaleidr in Ihre Seite. Der Editor erstellt eine eigene Karte im Mount-Ziel und legt seine Bedienfelder darüber. Er läuft in Ihrem Dokument, nicht in einem iframe.

Der eingebettete Editor speichert Änderungen nur im Arbeitsspeicher der Seite. Ein Speichern, Exportieren oder Veröffentlichen aus dem Embed ist nicht möglich; es gibt auch keinen Änderungs-Callback. Ein Neuladen oder handle.destroy() verwirft die Bearbeitungen.

Schlüssel	Veröffentlichbarer Schlüssel (kld_pk_live_…). Erforderlich.
Berechtigung	design. Standardmäßig in neuen Schlüsseln enthalten.
Tarif	Jeder Tarif, auch Free.
Darstellung	In Ihrer Seite.
Speicherung	Keine.
Instanzen	Eine pro Seite.
CSP	Siehe Editor-Abschnitt unter Content Security Policy.

Eine Anleitung finden Sie unter Editor einbinden.

Funktionsumfang

Enthalten	Nicht enthalten
Text auf der Karte platzieren	Registerkarte Daten und Datensatz-Upload
Bild: Bilder auf der Karte platzieren	Studio-Designkatalog mit Musterkarten und Stiltypen
Marker	KI-Bedienfeld
Popup	3D-Modellbibliothek
Hintergrund: Fläche hinter der Karte	Teilen und Veröffentlichen
Layer: Beschriftungen der Basiskarte, 3D-Gebäude, Licht und Gelände	Projekte: Karten speichern, öffnen und auflisten
Design: Basiskartenmerkmal, Kategorie oder Region auswählen und umgestalten	Anmeldung
Legende: Beschriftungs- und Legendeneinstellungen

Die linke Spalte entspricht der Werkzeugleiste des Editors von oben nach unten. Design ist im Embed das Werkzeug zur Umgestaltung; der Designkatalog von Studio ist nicht enthalten.

Einbindung

const handle = Kaleidr.mount('#editor', {
  product: 'editor',
  publishableKey: 'kld_pk_live_…',
  styleId: 'kaleidr-night',
  center: [-0.1276, 51.5072],
  zoom: 12,
});

<kaleidr-map product="editor" publishable-key="kld_pk_live_…"
             style-id="kaleidr-night" center="-0.1276,51.5072" zoom="12"
             style="display:block; height:640px"></kaleidr-map>

Das Mount-Ziel muss eine Höhe haben. Der Editor nutzt 100 % seiner Breite und Höhe. Er fügt dem Ziel eigene Elemente hinzu, ohne vorhandene Elemente zu entfernen. Nutzen Sie daher ein leeres Ziel.

Konfigurationsoptionen

Mount-Option	Attribut	Typ	Standardwert	Erforderlich	Beschreibung
product	product	'editor'	keiner	ja	Wählt den Editor.
publishableKey	publishable-key	Zeichenfolge	keiner	ja	kld_pk_…-Schlüssel mit Berechtigung design. Ein Serverschlüssel kld_sk_… wird im Browser noch vor einer Anfrage abgelehnt.
styleId	style-id	Zeichenfolge	Standardbasiskarte Ihrer Organisation, sonst kaleidr-morning	nein	Stil-ID wie kaleidr-night oder vollständige Stil-URL. Siehe Stil-IDs. Beim Mount festgelegt.
center	center	[longitude, latitude]; als Attribut "longitude,latitude"	[0, 0]	nein	Anfangsmittelpunkt.
zoom	zoom	Zahl	2	nein	Anfangszoom. Funktioniert ohne center.
pitch	pitch	Zahl, Grad	0	nein	Anfängliche Neigung.
bearing	bearing	Zahl, Grad	0	nein	Anfangsausrichtung.
theme	theme	Objekt oder JSON-Zeichenfolge eines Objekts	keiner	nein	Bis zu 17 benannte Schlüssel. Siehe Theme-Schlüssel. Nur beim Mount gelesen.
apiBase	api-base	URL	https://api.kaleidr.com/inference-api	nein	Ziel des Sitzungsaustauschs. Muss /inference-api enthalten. In Produktion nicht erforderlich.
tileBase	tile-base	URL	https://tile.kaleidr.com	nein	Host, über den Stil-IDs aufgelöst werden. In Produktion nicht erforderlich.
base	base	URL	https://cdn.kaleidr.com	nein	Ursprung, von dem das SDK editor.js lädt. Nur der Ursprung zählt; akzeptiert werden ausschließlich die unter Base-Überschreibung genannten Ursprünge.
enabled	flag	boolesch	keiner	nein	Mount-spezifischer Teil der Aktivierungssperre.

shareId, map, mapTarget, contained und viewerBase beeinflussen einen Editor-Mount nicht. Es gibt keine Option styleUrl; übergeben Sie eine URL als styleId.

Basiskarte

Der Editor wählt die Basiskarte in dieser Reihenfolge:

1. styleId, falls angegeben.
2. Die Standardbasiskarte Ihrer Organisation, falls festgelegt.
3. kaleidr-morning.

Die Basiskarte lässt sich nach dem Mount nicht ändern, und handle.setStyle wird im Editor nicht unterstützt. Um sie zu wechseln, zerstören Sie den Editor und mounten erneut. Dabei gehen die Änderungen verloren.

Kamera

• Bei center steht der Längengrad zuerst.
• Jeder Wert darf eine Zahl oder eine numerische Zeichenfolge sein.
• Ist eine Mount-Option keine endliche Zahl, wird sie ignoriert und der Standardwert verwendet. Die Konsole zeigt beispielsweise [kaleidr:editor] ignored zoom: abc is not a finite value — using 2 instead.
• Ungültige Kameraattribute des Elements werden ohne Meldung verworfen und durch den Standard ersetzt.

Theme-Schlüssel

theme ist ein Objekt mit den unten aufgeführten Schlüsseln. Jeder Wert ist eine Zeichenfolge mit einem CSS-Wert. Nicht gelistete Schlüssel und andere Werte als nicht leere Zeichenfolgen werden ohne Meldung ignoriert: fontSizeBase: 14 bewirkt nichts; fontSizeBase: '14px' funktioniert.

Schlüssel	Gestaltung	Beispiel
brandColor	Primäre Schaltflächen, Fokusringe, aktives Werkzeug.	'#0b5fff'
brandColorHover	Hover-Zustand von brandColor.	'#0847c2'
brandColorOn	Text und Symbole über brandColor.	'#ffffff'
textColor	Fließtext und Überschriften.	'#111827'
textColorMuted	Sekundärtext wie Bildunterschriften.	'#6b7280'
surfaceColor	Hintergrund von Karten und Dialogen.	'#ffffff'
borderColor	Rahmen und Trennlinien.	'#e5e7eb'
glassBg	Hintergrund halbtransparenter Felder: Seitenleiste und Ausklappmenüs. Für flache Optik Volltonfarbe angeben.	'rgba(255,255,255,0.8)'
glassBlur	backdrop-filter dieser Felder.	'blur(12px)'
cardRadius	Eckenradius von Karten und Dialogen.	'12px'
buttonRadius	Eckenradius von Schaltflächen und Chips.	'8px'
listRadius	Eckenradius von Listenzeilen.	'6px'
fontPrimary	Haupt-font-family.	'"Inter", system-ui, sans-serif'
fontMono	Nicht proportionale font-family.	'ui-monospace, monospace'
fontSizeBase	Grundschriftgröße.	'14px'
sidebarRailWidth	Breite der Seitenleiste.	'64px'
quickActionsWidth	Breite der schwebenden Schnellaktionsleiste.	'320px'

Kaleidr.mount('#editor', {
  product: 'editor',
  publishableKey: 'kld_pk_live_…',
  theme: {
    brandColor: '#0b5fff',
    brandColorOn: '#ffffff',
    fontPrimary: '"Inter", system-ui, sans-serif',
    buttonRadius: '8px',
  },
});

Verhalten:

• Das Theme ist keine Sammlung beliebiger CSS-Eigenschaften. Ein Schlüssel wie '--my-color' wird ignoriert.
• Die Werte werden bei gemountetem Editor am Wurzelelement des Dokuments gesetzt, damit Dialoge sie an jeder Darstellungsstelle übernehmen. Beim Zerstören werden die vorherigen Werte wiederhergestellt.
• Das Theme wird einmal beim Mount gelesen. handle.setTheme wird vom Editor nicht unterstützt; eine Änderung am theme-Attribut nach dem Mount führt nur zu einer Warnung.
• Ist theme eine Zeichenfolge, muss sie JSON enthalten, das mit { beginnt. Alles andere wird mit Konsolenwarnung ignoriert.

Steuer-Handle

Kaleidr.mount gibt das Handle synchron zurück. Siehe Handle-Matrix für alle Produkte.

Mitglied	Im Editor
handle.product	'editor'
handle.setCamera(camera)	Bewegt die Karte des Editors.
handle.setTheme(theme)	Nicht unterstützt. Gibt eine Warnung aus und bewirkt nichts.
handle.setStyle(style)	Nicht unterstützt. Gibt eine Warnung aus und bewirkt nichts.
handle.destroy()	Entfernt den Editor samt Karte, stellt Theme-Werte wieder her, stoppt Sitzungserneuerungen und verwirft die Änderungen.

Das Handle hat kein map-Mitglied. Ihre Seite kann nicht auf das interne Kartenobjekt des Editors zugreifen.

setCamera(camera)

handle.setCamera({ center: [2.3522, 48.8566], zoom: 12, duration: 1000 });

Feld	Typ	Beschreibung
center	[number, number]	Längengrad, Breitengrad.
zoom	Zahl	Zoomstufe.
pitch	Zahl	Neigung in Grad.
bearing	Zahl	Drehung in Grad.
duration	Zahl	Animationsdauer in Millisekunden. Weglassen oder 0 bedeutet Sprung ohne Animation.

Aufrufe während des Editor-Ladens werden gepuffert und nach dessen Start ausgeführt.

Elementattribute nach dem Mount

Bei einem gemounteten <kaleidr-map product="editor"> verschiebt eine Änderung von center, zoom, pitch oder bearing die Karte ohne Animation. Änderungen an style-id, theme oder anderen Attributen haben keine Wirkung.

Lebenszyklus

Ereignis	Ergebnis
Kaleidr.mount(...) oder Verbindung des Elements	Sitzungsaustausch und Laden von editor.js starten parallel. Der Editor beginnt, sobald beides abgeschlossen ist.
handle.destroy() oder Entfernen des Elements	Editor und Änderungen verschwinden.
Element wird zu anderem übergeordneten Element verschoben	Es wird zerstört und neu gemountet. Änderungen gehen verloren.
Zweiter Editor wird bei bereits vorhandenem Editor gemountet	Nicht unterstützt. Zerstören Sie zunächst den ersten.
Seite wird neu geladen	Änderungen gehen verloren.

Was in Ihrer Seite ausgeführt wird

Anders als die iframe-Produkte wirkt sich der Editor auf seine einbettende Seite aus:

• Er lädt editor.js, ein mehrere Megabyte großes Bundle, von https://cdn.kaleidr.com.
• Er fügt dem Dokument seine Stylesheets per JavaScript hinzu.
• Er ruft Stil, Tiles, Sprites und Schriftarten der Basiskarte von https://tile.kaleidr.com ab. Stil-, Sprite- und Schriftartenanfragen enthalten Ihren veröffentlichbaren Schlüssel als Query-Parameter key, damit der Host Ihre Seite erkennt. Tile-Datenanfragen haben keinen Schlüssel. Das Sitzungstoken erscheint niemals in einer URL.
• Er startet Karten-Webworker über blob:-URLs.
• Während des Mounts legt er Theme-Werte am Wurzelelement des Dokuments fest.

Die passenden CSP-Anweisungen finden Sie unter Content Security Policy.

Konsolenmeldungen

Meldung	Bedeutung
[kaleidr:editor] [editor-embed] attach() requires an { apiKey }	Kein Schlüssel übergeben. Nichts wird angezeigt.
[kaleidr:editor] kaleidr session exchange failed (<status>)	Sitzungsaustausch wurde verweigert. Der Grund steht in der Antwort im Netzwerk-Tab. Bei 403 steht der Code in detail, etwa insufficient_scope bei fehlendem design; bei 429 in error.
CORS-Fehler für …/sdk/sessions, dann [kaleidr:editor]-Fetch-Fehler	Schlüssel unbekannt oder widerrufen oder Seitenursprung nicht zugelassen.
[kaleidr:editor] Kaleidr: a server key (kld_sk_…) must never be used in the browser — it is a standing secret. …	Serverschlüssel übergeben. Keine Anfrage gesendet.
[kaleidr:editor] ignored <field>: <value> is not a finite value — using <default> instead.	Eine Kameraoption bei Kaleidr.mount war keine Zahl. Elementattribute erzeugen diese Meldung nicht.
[kaleidr:editor] <message>	Interne Kartenfehlermeldung, etwa nach fehlgeschlagenem Stil- oder Tile-Ladevorgang.
[kaleidr] theme string must be JSON …; named string themes are not supported. Ignored.	theme war eine Zeichenfolge ohne JSON-Objekt.
[kaleidr] theme JSON parse failed (…); ignored.	theme war ungültiges JSON.
[kaleidr] setTheme() is not supported on product "editor" — the call is a no-op. …	setTheme aufgerufen oder theme nach Mount geändert.
[kaleidr] setStyle() is not supported on product "editor" — the call is a no-op. …	setStyle wurde aufgerufen.

Nicht verfügbar

• Bearbeitungen speichern, exportieren oder veröffentlichen.
• Änderungsereignis, Bereit-Ereignis oder Fehler-Callback.
• Zugriff auf Kartenobjekt, eigene Layer oder gezeichnete Inhalte.
• Basiskarte oder Theme nach dem Mount ändern.
• Mehr als ein Editor auf einer Seite.

Verwandte Seiten

• Editor einbinden
• Loader kaleidr.js
• Das Element <kaleidr-map>
• Veröffentlichte Karte einbetten für dauerhaft gespeicherte Karten