SVG-Karte

Eine SVG-Karte ist eine geographische Visualisierung, die im Format Scalable Vector Graphics (SVG) gerendert wird, einem W3C-Webstandard zur Beschreibung zweidimensionaler Vektorgrafiken in XML. Da SVG-Elemente Teil des Document Object Model (DOM) sind, lassen sie sich mit CSS gestalten, mit JavaScript animieren und über Event-Listener interaktiv machen. Das macht SVG zu einer naheliegenden Wahl für thematische Webkarten, besonders bei einer überschaubaren Anzahl an Features.

D3.js ist die verbreitetste Bibliothek zur Erzeugung von SVG-Karten aus GeoJSONGeoJSONGeoJSON is an open standard format for encoding geographic data structures using JavaScript Object Notation (JSON). I...-Daten. Sie übernimmt Kartenprojektionen, das Rendering von Pfaden, die Farbskalierung und die Interaktion auf hochgradig anpassbare Weise. SVG-Karten kommen häufig bei Choroplethenkarten von Ländern oder Bundesstaaten, in Wahl-Dashboards und bei infografikartigen Karten in Nachrichtenmedien zum Einsatz. Da jede geographische Form ein eigenständiges DOM-Element ist, lassen sich Tooltips, Klick-Handler und Übergänge einfach an einzelne Features binden.

Die große Stärke von SVG-Karten ist die Auflösungsunabhängigkeit: Sie wirken bei jeder Zoomstufe und Druckauflösung scharf. Bei sehr großen Datensätzen stoßen sie jedoch an Performance-Grenzen, weil jedes gerenderte Element den DOM vergrößert. Für Karten mit tausenden Punkten oder komplexen Geometrien ist Canvas- oder WebGLWebGLWeb Graphics Library (WebGL) is a cutting-edge web technology that brings high-performance 3D and 2D graphics renderi...-Rendering performanter. Bei der Barrierefreiheit liegt eine weitere Stärke von SVG: Elemente können ARIA-Labels und Title-Attribute tragen, die Screenreader interpretieren, wodurch SVG-Karten zugänglicher sind als canvas-basierte Alternativen.