MediaWiki:Kartographer.js

Version vom 10. Juni 2025, 20:57 Uhr von TinyOyster (Diskussion | Beiträge)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)

Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.

  • Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
  • Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
  • Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
/* Global JavaScript for Kartographer maps */

(function (mw) {
  // Metadata-only definitions: no direct L.* calls here
  const tileLayers = {
    overlays: {
      openseamap: {
        name: "Open Sea Map",
        isVector: false,
        tilesUrl: "https://tiles.openseamap.org/seamark/{z}/{x}/{y}.png",
        options: {
          spDefaultActive: true,
          attribs: [
            {
              url: "https://www.openstreetmap.org/copyright",
              name: "OpenStreetMap",
              label: "Map data"
            },
            {
              url: "https://www.openseamap.org/",
              name: "Open Sea Map",
              label: "Map style"
            }
          ],
          maxNativeZoom: 18,
          maxZoom: 19,
        }
      },
      contours: {
        name: "Contours",
        isVector: true,
        tilesUrl: "https://tiles.scuba-spot.info/contours/{z}/{x}/{y}",
        options: {
          vectorTileLayerStyles: {
            merged: { weight: 1, color: "#333" }
          },
          interactive: true,
          defaultActive: false,
          maxNativeZoom: 18,
          maxZoom: 19,
        }
      }
    },
    baseLayers: {
      // future base-layer entries
    }
  };

  // Create a Leaflet layer (tile or vector) from metadata
  function makeLayer(def) {
    if (def.isVector) {
      return L.vectorGrid.protobuf(def.tilesUrl, def.options);
    }
    return L.tileLayer(def.tilesUrl, def.options);
  }

  // Add layers to the map with control and default activation
  function addCustomLayers(map) {
    const base = {};
    const overlays = {};

    Object.values(tileLayers.baseLayers).forEach(def => {
      base[def.name] = makeLayer(def);
    });

    Object.values(tileLayers.overlays).forEach(def => {
      const layer = makeLayer(def);
      overlays[def.name] = layer;
      if (def.options.spDefaultActive) {
        layer.addTo(map);
      }
    });

    L.control.layers(base, overlays).addTo(map);
  }

  // Inline maps
  mw.hook("wikipage.maps").add(function (maps) {
    if (Array.isArray(maps)) {
      maps.forEach(addCustomLayers);
    } else {
      addCustomLayers(maps);
    }
  });

  // Full-screen maps
  mw.hook("kartographer.bootstrap.map").add(addCustomLayers);
  mw.hook("kartographer.bootstrap.mapWindow").add(addCustomLayers);
})(mediaWiki);