Ein gutes Pop-up macht aus Rohdaten klare Informationen und verbessert das Nutzererlebnis. Besonders Textelemente bieten vielfältige Möglichkeiten, Inhalte ansprechend und kontextbezogen darzustellen. In diesem Beitrag erfahren Sie Schritt für Schritt, wie Textelemente in Pop-ups genutzt werden können, um Ihre Karten interaktiver und informativer zu gestalten.
Ein wichtiger, aber manchmal übersehener Aspekt bei der Erstellung guter Webkarten ist die Konfiguration von Pop-ups für Layer. Ein gut gestaltetes Pop-up kann eine Liste von Rohdaten in aussagekräftigere Informationen verwandeln und den Betrachter:innen Ihrer Karte ein informatives Erlebnis bieten.
Pop-ups werden durch das Konfigurieren und Hinzufügen von Inhaltselementen erstellt. Zu den Elementen gehören: Feldliste, Diagramm, Bild, Text und Arcade. Mit Arcade können zudem Ausdrücke erstellt werden, die in Textelementen verwendet werden können. Sie können mehrere Elemente eines beliebigen Typs hinzufügen und diese in beliebiger Reihenfolge anordnen – vertikal, horizontal oder kombiniert.
Für einen Überblick werfen Sie einen Blick auf den Blog-Beitrag Pop-ups: Die Grundlagen. Dieser Beitrag bietet eine Einführung in die Verwendung von Textelementen in Pop-ups und deckt die Grundlagen ab, um sie effektiv nutzen zu können.
Beispiele für Pop-up-Textelemente in einer Karte
Die in diesem Blogartikel beschriebenen Beispiele können Sie in der Karte „Pop-up Text Element Examples Map“ ansehen. Nachdem Sie die Karte geöffnet haben, können Sie sich anmelden, um die Karte in Ihrem Content-Bereich zu speichern. Alternativ können Sie auch ohne Anmeldung die Beispiele nachverfolgen.
Jede Pop-up-Konfiguration wird in einem eigenen Layer innerhalb eines Gruppen-Layers dargestellt. Der Layer-Name gibt dabei an, wie das jeweilige Pop-up konfiguriert wurde.
Öffnen Sie das Layer-Fenster über die Werkzeugleiste „Inhalte“ (dunkel) und anschließend den Gruppen-Layer.
Um das Pop-up anzuzeigen, schalten Sie die Sichtbarkeit des gewünschten Layers ein.
Klicken Sie auf ein Feature in der Karte, um das konfigurierte Pop-up anzuzeigen.
Tipp: Klicken Sie auf die Schaltfläche „Andocken“, um das Pop-up anzudocken und mehr von dessen Inhalt anzuzeigen.
Um zu sehen, wie das Pop-up konfiguriert wurde, stellen Sie sicher, dass der Layer ausgewählt ist (eine blaue Markierungsleiste erscheint auf der linken Seite).
Klicken Sie in der Werkzeugleiste „Einstellungen“ (hell) auf „Pop-ups“. Klicken Sie auf den Pfeil, um das Element zu erweitern, und dann auf „Text bearbeiten“, um den Text-Editor zu öffnen und zu sehen, wie das Element konfiguriert wurde.
Ein Textelement hinzufügen
Klicken Sie auf „Inhalt hinzufügen“, um eine Liste der Elemente anzuzeigen. Wählen Sie anschließend „Text“ aus.
Wenn Sie ein Textelement hinzufügen, öffnet sich der Text-Editor. Mit dem Editor können Sie „{“ eingeben oder das Tool „Feldliste“ verwenden, um ein Feld oder einen Ausdruck auszuwählen, normalen Text eingeben, Links hinzufügen, HTML nutzen und Formatierungswerkzeuge verwenden, um den Text zu gestalten. Bewegen Sie den Mauszeiger über eine beliebige Schaltfläche, um mehr darüber zu erfahren.
Das Textelement konfigurieren
Folgen Sie den unten stehenden Schritten, um das Textelement auf verschiedene Weise zu konfigurieren. Sehen Sie sich die Karte mit den Beispielen für Pop-up-Textelemente an, um die Beispiel-Layer anzusehen. Wählen Sie diese aus und schalten Sie ihre Sichtbarkeit um, um zu prüfen, wie sie konfiguriert wurden.
Text aus einem Feld
In einigen Fällen kann ein Attributfeld beschreibenden Text enthalten, den Sie direkt zu Ihrem Textelement hinzufügen können. Geben Sie „{“ ein, um eine Liste der Felder anzuzeigen, oder klicken Sie auf das Tool „Feldliste“ und wählen Sie das Feld mit der Beschreibung aus.
Wenn Sie fertig sind, klicken Sie auf „OK“. Das unten gezeigte Layer-Pop-up verwendet den Inhalt des Feldes {DESC_}, um eine Beschreibung für das Feature hinzuzufügen.
Formatierten Text mit Feldern und Links
Beginnen Sie damit, normalen Text und Felder nach Wunsch einzugeben. Sie können die Typografie ändern und Vordergrund- sowie Hintergrundfarben wählen, um bestimmte Informationen hervorzuheben.
Um einen Link hinzuzufügen, markieren Sie den Text, den Sie als Link verwenden möchten, und klicken Sie dann auf die Schaltfläche „Link“. Geben Sie die vollständige URL ein (z. B. https://www.esri.com). Beachten Sie, dass nur https-Links unterstützt werden.
Um einen Link aus einem Feld hinzuzufügen, muss das Feld manuell mit geschweiften Klammern ({field}) hinzugefügt werden.
Tipp: Sie können zuerst das Feld hinzufügen, es dann kopieren und löschen. Geben Sie den Linktext ein, klicken Sie auf die Schaltfläche „Link“ und fügen Sie das kopierte Feld in das Link-Eingabefeld ein.
Textelement mit HTML
Klicken Sie auf die Schaltfläche „Quellcode“ im Editor, um HTML einzugeben. Wenn Sie fertig sind, klicken Sie erneut auf die Schaltfläche „Quellcode“, um das Ergebnis anzuzeigen, und klicken Sie dann auf „OK“. Siehe „Unterstütztes HTML“ für eine Liste der unterstützten HTML-Tags und -Attribute, die Sie verwenden können.
Mit dem unten gezeigten HTML wurde das Pop-up so konfiguriert, dass eine Tabelle angezeigt wird, die Informationen zu jedem Gipfel unter Verwendung mehrerer anderer Felder auflistet. Sie können auch das Tool „Tabelle einfügen“ verwenden, um die Tabelle zu gestalten, obwohl diese wahrscheinlich durch direkte Bearbeitung des HTML weiter angepasst und finalisiert werden muss.
Textelement mit Arcade
Arcade ist eine Ausdruckssprache, die in ArcGIS unterstützt wird. Sie kann verwendet werden, um Berechnungen durchzuführen, Text zu manipulieren und logische Aussagen zu bewerten.
In Pop-ups wird Arcade auf zwei Arten verwendet: um Ausdrücke in Textelementen zu erstellen, die wie Felder ausgewertet werden können, oder als separate Elemente, die einen Block von Inhalten zurückgeben.
Dieses Pop-up-Beispiel verwendet einen einzelnen Ausdruck ({expression/expr0}), um eine Zeichenkette zurückzugeben, die das Ranking der Prominenz beschreibt.
Um einen Arcade-Ausdruck zu erstellen, öffnen Sie „Optionen“ im Pop-up-Fenster und klicken Sie auf „Attribute expressions“.
Wenn bereits Ausdrücke vorhanden sind, wird eine Liste dieser angezeigt. Klicken Sie auf den Ausdruck, um ihn im Arcade-Editor zu öffnen. Um einen neuen Ausdruck hinzuzufügen, klicken Sie auf „Add expression“.
Dies öffnet den Arcade-Editor. Geben Sie den gewünschten Arcade-Ausdruck ein. Klicken Sie auf „Ausführen“, um zu überprüfen, ob er funktioniert.
Tipp: Ändern Sie den Titel, um den Ausdruck leichter zu finden und zu verstehen. Wenn Sie fertig sind, klicken Sie auf „Fertig“.
Der unten gezeigte Arcade-Ausdruck verwendet den ganzzahligen Wert der Prominenz in Fuß, um eine Zeichenkette zurückzugeben, die das relative Prominenz-Ranking anzeigt. Weitere Informationen und weitere Arcade-Beispiele finden Sie unter „Pop-ups: Arcade Essentials“.
Weitere Beiträge zu Pop-ups
Dieser Beitrag ist eine Übersetzung des amerikanischen Original-Beitrags.
Hier geht es zum Original-Beitrag!
