map0

Kartenfunktionen

Teilen & Permalink

Den aktuellen Kartenausschnitt und die Layer-Einstellungen über einen Link teilen.

Ausprobieren: Die Karte verschieben, einen Layer umschalten oder dessen Deckkraft ändern. Die Adressleiste wird automatisch aktualisiert. Die Teilen-Schaltfläche links oben kopiert den Link; in einem neuen Reiter lässt sich damit die Ansicht wiederherstellen.

Was im Link steckt

Der Link speichert Änderungen gegenüber dem konfigurierten Zustand. Andere Einstellungen stammen weiterhin aus der Konfiguration. Ein aktualisierter Layer-Titel erscheint dadurch auch beim Öffnen eines älteren Links.

Im Zusammenspiel mit der Host-Seite

Der Zustand wird base64url-kodiert in einem Hash-Parameter gespeichert, standardmäßig #map0=…. Andere Hash-Inhalte bleiben erhalten. Bei einem Konflikt mit der eigenen Anwendung lässt sich der Parameter umbenennen:

excerpt
"permalink": true,
"permalink": { "param": "karte" }

Aktualisierungen werden gebündelt und verwenden history.replaceState. Beim Verschieben der Karte entstehen dadurch keine zusätzlichen Einträge im Browser-Verlauf.

Konfiguration

permalink.map0.json
{
  "$schema": "https://map0.net/schema/v1.json",
  "version": 1,
  "meta": { "title": "Shareable map state" },
  "map": { "center": [16.3725, 48.2083], "zoom": 12 },
  "permalink": { "param": "map0" },
  "basemaps": [
    {
      "id": "grau",
      "title": "Grey",
      "type": "raster",
      "url": "https://mapsneu.wien.gv.at/basemap/bmapgrau/normal/google3857/{z}/{y}/{x}.png",
      "attribution": "© basemap.at",
      "default": true
    },
    {
      "id": "ortho",
      "title": "Aerial",
      "type": "raster",
      "url": "https://mapsneu.wien.gv.at/basemap/bmaporthofoto30cm/normal/google3857/{z}/{y}/{x}.jpeg",
      "maxZoom": 19,
      "attribution": "© basemap.at"
    }
  ],
  "layers": [
    {
      "id": "widmung",
      "type": "wms",
      "title": "Zoning plan",
      "url": "https://data.wien.gv.at/daten/geo",
      "layers": "GENFLWIDMUNGOGD",
      "opacity": 0.55,
      "info": { "format": "application/json" },
      "attribution": "Stadt Wien, data.wien.gv.at"
    },
    {
      "id": "areas",
      "type": "geojson",
      "title": "Demo zones",
      "data": "/data/demo-areas.geojson",
      "visible": false,
      "style": { "fill-color": "#f59e0b", "fill-opacity": 0.3, "line-color": "#f59e0b", "line-width": 2 }
    }
  ],
  "controls": { "layerSwitcher": { "open": true, "allowAdd": true } }
}

Aus Code

host-page.js
const api = document.querySelector('map0-viewer').api;
const url = api.getShareUrl();  // null when permalink is disabled