Zum Hauptinhalt springen

Viewer

Mit Viewer binden Sie eine in Kaleidr Studio veröffentlichte Karte in Ihre Seite ein. Sie wird in einem von Kaleidr gehosteten iframe gerendert, sodass Ihre Seite weder eine Kartenbibliothek noch einen API-Schlüssel laden muss. Die ID der veröffentlichten Karte genügt.

Nutzen Sie Viewer, wenn eine Karte bereits in Studio existiert und Besucher sie sehen sollen: als Filialfinder, Campusplan, Veranstaltungsroute oder Datenkarte in einem Artikel.

Auf einen Blick​

FrageAntwort
Was benötige ich?Die ID einer veröffentlichten Karte. Kein API-Schlüssel und keine Sitzung.
Welcher Tarif?Alle Tarife einschließlich Free. Für die Veröffentlichung ist ein Kaleidr-Konto nötig.
Wie wird die Karte dargestellt?In einem iframe von https://map-embed.kaleidr.com.
Was wird angezeigt?Die veröffentlichte Karte mit Markern, Routen, gestalteten Ebenen sowie Datensätzen und Bild-Overlays, die der Autor in Studios Datenbereich hochgeladen hat.
Wie binde ich sie ein?Mit einem einfachen <iframe> oder dem SDK-Element <kaleidr-map product="viewer">.
Was kostet es?Jeder Aufruf zählt als ein Kartenladen für die Organisation des Kartenbesitzers.
Kann die Seite die Karte steuern?Sie kann die Kamera setzen und bewegen sowie Lade- und Fehlermeldungen empfangen. Sonst nichts.

Kleinste Einbindung​

<script src="https://cdn.kaleidr.com/embed/v1/kaleidr.js"></script>
<kaleidr-map product="viewer"
             share-id="YOUR_MAP_ID"
             style="display:block; height:480px"></kaleidr-map>

Ersetzen Sie YOUR_MAP_ID durch die ID, die Studio nach der Veröffentlichung im Einbettungscode anzeigt. Das Element hat standardmäßig display:block, damit height wirkt. Der Code setzt zusätzlich display:block für Safari vor 16.4, wo das Element inline bleibt und height ignoriert.

Wenn Sie kein Skript hinzufügen können (etwa bei einem Website-Builder, CMS oder Newsletter-Tool mit HTML-Unterstützung), verwenden Sie stattdessen den von Studio erzeugten iframe:

<iframe
  src="https://map-embed.kaleidr.com/embed/YOUR_MAP_ID"
  width="100%"
  height="480"
  style="border:0;"
  loading="lazy"
  referrerpolicy="no-referrer-when-downgrade"
  allow="geolocation; microphone; fullscreen; clipboard-write"
  title="Kaleidr map"
></iframe>

Beide Varianten zeigen dieselbe Karte. Veröffentlichte Karte einbetten erläutert, wann welche Variante sinnvoll ist.

Funktionsweise​

  1. Sie veröffentlichen eine Karte in Studio. Studio vergibt eine ID und erzeugt den Einbettungscode.
  2. Ihre Seite lädt diesen Code. Das SDK-Element oder der einfache iframe verweist auf https://map-embed.kaleidr.com/embed/YOUR_MAP_ID.
  3. Die Seite im iframe ruft die veröffentlichte Karte ab und zeichnet sie zusammen mit den vom Autor hochgeladenen Datensätzen und Bild-Overlays. Ist eine Liste erlaubter Domains eingerichtet, prüft sie zuvor die Domain Ihrer Seite.
  4. Wenn die Karte gezeichnet ist, sendet der iframe kaleidr-embed:ready an Ihre Seite. Kann sie nicht gezeichnet werden, sendet er kaleidr-embed:error und zeigt statt der Karte eine kurze Erklärung.

Ihre Seite erhält niemals die Kartendaten und kann nicht auf den Inhalt des iframe zugreifen. Kartenbibliothek, Stile und Netzwerkanfragen bleiben vollständig im iframe. Deshalb muss Ihre Content Security Policy lediglich den Frame erlauben.

Was Besucher tun können​

  • Die Karte verschieben, drehen, neigen und über die Zoomtasten, eine Pinch-Geste oder das Mausrad vergrößern. Scrollen mit dem Mauszeiger über der Karte zoomt die Karte, wie in Studio. Mit dem Mauszeiger außerhalb der Karte bewegt Scrollen die Seite.
  • Mit der Standort-Schaltfläche den eigenen Standort anzeigen, nachdem der Browser um Erlaubnis gefragt hat.
  • Orts-Popups durch Anklicken öffnen, wenn der Autor sie in Studio aktiviert hat.
  • Legenden und Quellenangaben am unteren Kartenrand lesen.
  • Kaleidr AI Fragen zur Karte stellen: im Panel Ask Kaleidr, wenn der Autor in der Kachel Kaleidr AI in Studio Control Tower aktiviert hat, und in den Popups, wenn Popup Window aktiviert ist. Siehe Kaleidr AI auf einer veröffentlichten Karte.

Die Einbindung ist schreibgeschützt. Besucher können die Karte nicht bearbeiten, und ihre Aktionen werden nicht gespeichert.

Was Ihre Seite tun kann​

  • Startkamera festlegen mit center, zoom, pitch und bearing. Standard ist die vom Autor gespeicherte Ansicht. Von Ihrer Seite gesetzte Kamerawerte haben feldweise Vorrang.
  • Kamera später bewegen über handle.setCamera(...) oder durch Ändern der Kameraattribute des Elements.
  • Lade- oder Fehlzustand erkennen über die beiden Nachrichten des iframe.
  • Karte entfernen über handle.destroy() oder durch Entfernen des Elements.

Einstellungen für Kartenbesitzer​

Diese befinden sich in Studio und nicht im Einbettungscode:

  • Veröffentlichen und Veröffentlichung zurücknehmen. Eine veröffentlichte Karte zeigt den aktuell in Studio gespeicherten Stand. Gespeicherte Änderungen sind beim nächsten Laden der Einbindung öffentlich, ohne erneute Veröffentlichung. Erneut veröffentlichen erstellt eine neue veröffentlichte Version unter demselben Link. Für private Änderungen nehmen Sie die Veröffentlichung zunächst zurück und veröffentlichen anschließend erneut. Veröffentlichung zurücknehmen stoppt alle Einbindungen; eine erneute Veröffentlichung stellt dieselben URLs wieder her. Siehe Karte zurückziehen.
  • Hochgeladene Daten. Datensätze und Bild-Overlays einer veröffentlichten Karte sind für Besucher sichtbar. Löschen Sie einen Datensatz im Datenbereich oder nehmen Sie die Veröffentlichung zurück, um ihn nicht mehr bereitzustellen. Freigabelinks funktionieren nach dem Zurückziehen weiterhin; das Löschen eines Datensatzes entfernt ihn auch aus diesen Links. Eine veröffentlichte Karte ist öffentlich: veröffentlichen Sie nur Daten, die jeder lesen darf. Siehe Hochgeladene Daten auf veröffentlichten Karten.
  • Erlaubte Domains. Beschränken Sie die Websites, auf denen die Karte erscheint. Die Prüfung verwendet den Referrer Ihrer Seite; ohne Referrer kann eine domainbeschränkte Karte nicht angezeigt werden.
  • Kaleidr AI. Aktivieren Sie in der Kachel Kaleidr AI der Karte das Panel Ask Kaleidr (Control Tower) und AI-Chat in Popups (Popup Window).

Einschränkungen​

  • Es gibt keinen Schlüssel, daher gelten schlüsselbasierte Kontrollen wie erlaubte Origins nicht. Verwenden Sie die erlaubten Domains der Karte.
  • Ihre Seite kann Ebenen nicht auslesen, keine Marker hinzufügen und keine Klickereignisse empfangen.
  • Die Einbindung ändert ihre Höhe nicht selbst. Geben Sie dem Element oder iframe eine Höhe.
  • Ist das Kartenladekontingent der Besitzerorganisation erschöpft, wird bis zur Zurücksetzung anstelle der Karte eine Hinweismeldung angezeigt.
  • Besucher laden jeden dargestellten Datensatz vollständig herunter. Große Tabellen verzögern daher die Darstellung.

Nächste Schritte​