Sprache
Deutsch

Beispiele für die Embed API

Jedes Beispiel ist eine Live-Karte zum Ausprobieren, gefolgt von der vollständigen Seite, die sie erzeugt. Alle steuern dieselbe veröffentlichte Karte (2.480 Städte weltweit und 233 Länder aus Natural Earth). So sehen Sie, wie viel sich mit einer einzigen Karte von der umgebenden Seite aus erreichen lässt.

Beispiel Zeigt
Eine Karte anzeigen Eine veröffentlichte Icon Map mit einem einzigen Aufruf in eine Seite einbinden und auslesen, was die Karte beantwortet.
Zu einem Ort fliegen Die Kamera einer eingebetteten Icon Map steuern: zu einem Ort fliegen, einen Begrenzungsrahmen oder eine ganze Ebene einpassen und die Ansicht auslesen.
Ebenen ein- und ausschalten Einen eigenen Ebenenumschalter für eine eingebettete Icon Map aus den Ebenen bauen, die die Karte meldet, und ihn mit dem Betrachter synchron halten.
Mit Datenschnitten filtern Die Datenschnitte einer eingebetteten Icon Map über Ihre eigene Filteroberfläche steuern und beide in beide Richtungen synchron halten.
Von Ihrer Seite aus filtern Deklarierte Filter von Ihrer eigenen Seite aus auf eine eingebettete Icon Map anwenden und sehen, wie ein nicht deklarierter Filter abgelehnt wird.
Auswählen und hervorheben Eine Liste auf Ihrer Seite und Features auf einer eingebetteten Icon Map gegenseitig hervorheben, in beide Richtungen.
Lesezeichen, Szenen und Touren Die Lesezeichen des Autors anwenden, eigene Ansichten erfassen und wiederherstellen, einen Link zur aktuellen Ansicht kopieren und eine Tour in einer eingebetteten Icon Map abspielen.
Die Einbettung umgestalten Grundkarten wechseln, die eigenen Bedienelemente der eingebetteten Icon Map ausblenden, aus den Legendendaten eine eigene Legende zeichnen und die Karte als Bild exportieren.
Popup-Befehle und Ereignisse Dem Feature-Popup einer eingebetteten Icon Map eine eigene Aktion hinzufügen und die ausgelösten Ereignisse beobachten, jeweils mit einem reason.

Den Code verwenden

Jedes Listing ist eine vollständige HTML-Seite. Bis das SDK auf npm verfügbar ist, wird es hier bereitgestellt: https://www.icon-map.com/js/iconmap-embed/2/iconmap-embed.umd.min.js (etwa 17 KB, keine Abhängigkeiten; es definiert eine globale Variable, IconMapEmbed).

So führen Sie ein Beispiel mit Ihrer eigenen Karte aus:

  1. Veröffentlichen Sie die Karte aus Icon Map und fügen Sie Ihre Website unter Allowed origins hinzu.
  2. Ersetzen Sie "pub_..." durch Ihre Publish-ID.
  3. Ersetzen Sie die Namen von Ebenen, Datenschnitten und Feldern durch die Ihrer Karte. Noch besser: Bauen Sie die Oberfläche aus getLayers(), getSlicers() und getFilterSchema() auf, wie es mehrere der Beispiele tun.

Neu bei der API? Beginnen Sie mit Erste Schritte.