Interaktive SVG-Karte von Berlin mit React-Framework erstellen
Für eine webbasierte und interaktive Darstellung von Kartendaten eignet sich die Kombination aus SVG-Standard und dem React-Framework.
- Thomas Derflinger
Berlin als Großstadt überzeugt mit vielfältigem Leben in den Bezirken. Um dieses Spektrum im Web abzubilden, bieten sich interaktive Karten an. Die geografischen Umrisse der Stadtteile lassen sich so mit Statistiken und Metriken verbinden. Dies nutzen vor allem Immobilienfirmen in Analysedashboards oder stadteigene Anwendungen.
Die Beispiele des Artikels sind mit dem Webframework React erstellt, das sich für das Programmieren interaktiver Webanwendungen eignet. Es nutzt HTML direkt in JavaScript mit JSX (JavaScript XML).
Neben React kommt der Grafikstandard SVG zum Einsatz, der sich für Kartenanwendungen gut eignet. 1998 von der W3C-Arbeitsgruppe als offener Standard entwickelt, beschreibt er als Vektoren dargestellte Grafiken. Eine Grafik lässt sich damit ohne Darstellungsverluste vergrößern. SVG ist ein von Maschinen und Menschen lesbares Format, das in HTML eingefügt und so ein integraler Bestandteil einer Webseite wird. Die SVG-Grafik ist zudem animierbar.
Immer mehr Wissen. Das digitale Abo für IT und Technik.
Funktionsweise von Passkeys im Detail erklärt
Fürs Homeoffice: Elektrisch höhenverstellbare Schreibtische im Test
Wärmepumpe simpel und effektiv: Über die Rolle von Dämmung, Solar und Co.
Security: Passkeys mit Open-Source-Tools nutzen
VMs mit Thin Client: Desktops und Anwendungen verteilt im LAN nutzen
Ikea-Hack: LED-Leuchtwürfel in ein smartes Gerät umbauen
Immer mehr Wissen. Das digitale Abo für IT und Technik.
Funktionsweise von Passkeys im Detail erklärt
Fürs Homeoffice: Elektrisch höhenverstellbare Schreibtische im Test
Wärmepumpe simpel und effektiv: Über die Rolle von Dämmung, Solar und Co.
Security: Passkeys mit Open-Source-Tools nutzen
VMs mit Thin Client: Desktops und Anwendungen verteilt im LAN nutzen