Source: https://cd.union-investment.de/anwendungen/Digitalmedien/komponentenbibliothek/interaktivekarte
Die Komponente ermöglicht es, komplexe räumliche oder thematische Zusammenhänge visuell darzustellen. Nutzer können über Markierungen (Points of Interest) auf einem Hintergrundbild gezielt Informationen abrufen und diese zusätzlich filtern oder in einer Liste anzeigen lassen.
Die Interaktive Karte besteht aus:
einem Hintergrundbild (z. B. Karte, Lageplan, Illustration)
mehreren Points of Interest (POIs), die frei auf dem Bild positioniert werden
Jeder POI kann folgende Inhalte enthalten:
Name / Titel
Kategorie (mit zugehörigem Icon)
optional:
Bild
Beschreibungstext
Link (z. B. zu Detailseiten oder weiterführenden Informationen)
Die Positionierung der POIs erfolgt über X- und Y-Koordinaten, wodurch eine präzise Platzierung auf dem Hintergrundbild möglich ist.
Zusätzlich stehen zur Verfügung:
eine Filterfunktion zur Einschränkung der angezeigten POIs
eine Listendarstellung, die alle POIs strukturiert auflistet
Unterschiedliche Kategorien von POIs, jeweils mit eigenem Icon
POIs mit:
reinem Textinhalt
erweitertem Inhalt (Bild, Text, Link)
Darstellung:
Interaktion ausschließlich über die Karte
Kombination aus Kartenansicht und ergänzender POI-Liste
Das Hintergrundbild bildet die visuelle Grundlage und sollte ausreichend Kontrast für POIs bieten.
POIs werden über Icons dargestellt, die sich durch ihre Kategorie visuell unterscheiden.
Beim Klick auf einen POI öffnet sich eine Informationsansicht mit den hinterlegten Inhalten.
Filter- und Listenansicht sorgen für Übersichtlichkeit, insbesondere bei vielen POIs.
Die Gestaltung unterstützt sowohl exploratives Entdecken als auch gezielte Suche.
Ideal zur Darstellung von:
Standorten
Projekt- oder Themenübersichten
Angeboten, Services oder Kontaktpunkten
Zusammenhängen, die räumlich oder visuell erklärt werden sollen
Besonders geeignet, wenn:
viele Informationen strukturiert auf einem Bild verortet werden sollen
Nutzer Inhalte selbst entdecken oder filtern sollen
Empfehlung: Begrenzen Sie die Anzahl der POIs pro Ansicht auf ein überschaubares Maß und nutzen Sie Kategorien sowie Filter, um die Benutzerfreundlichkeit zu erhalten.
UniProfil: Für interaktive Entdecker
Storybook Web Components
Entwickler können unsere Web Components unmittelbar in Webseiten und mobilen Applikationen einsetzen. Somit profitieren Sie von einem fertig verwendbaren Framework.
Zu der CMS-Komponente