Widget:Leaflet

<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.3/dist/leaflet.css"/> <script src="https://unpkg.com/leaflet@1.9.3/dist/leaflet.js"></script>

<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.css"/> <link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.5.3/dist/MarkerCluster.Default.css"/> <script src="https://unpkg.com/leaflet.markercluster@1.5.3/dist/leaflet.markercluster.js"></script>

<script> (function(){

   // raw JSON aus dem Seiten-Skriptblock holen
   var rawEl = document.getElementById('smw-data');
   if (!rawEl) {
       console.error("Kein Element mit id='smw-data' gefunden. Bitte #ask auf der Seite einbinden.");
       return;
   }
   var raw = rawEl.textContent.replace(/<\/?p>/g,).trim(); // p-Tags entfernen, falls vorhanden
   // optional: debug in Konsole
   console.log("raw SMW output:", raw);

   var schoolData;
   try {
       schoolData = JSON.parse(raw);
   } catch (e) {
       console.error("Fehler beim Parsen der SMW-Daten:", e);
       return;
   }

   var map = L.map('map').setView([50.94, 6.96], 11);
   L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom:18, attribution:'© OSM' }).addTo(map);

   var clusters = {
       Grundschule: L.markerClusterGroup(),
       Gymnasium: L.markerClusterGroup(),
       Gesamtschule: L.markerClusterGroup(),
       Berufskolleg: L.markerClusterGroup(),
       Förderschule: L.markerClusterGroup(),
       Unbekannt: L.markerClusterGroup()
   };

   var bounds = [];
   schoolData.forEach(function(s){
       if (!s.coords) return;
       var parts = s.coords.split(',');
       if (parts.length !== 2) return;
       var lat = parseFloat(parts[0]), lon = parseFloat(parts[1]);
       if (isNaN(lat) || isNaN(lon)) return;
       var type = s.type || "Unbekannt";
       var marker = L.marker([lat, lon]).bindPopup('' + (s.name||) + '
' + type);
       (clusters[type] || clusters.Unbekannt).addLayer(marker);
       bounds.push([lat, lon]);
   });

   Object.values(clusters).forEach(function(g){ map.addLayer(g); });

   L.control.layers(null, {
       "Grundschulen": clusters.Grundschule,
       "Gymnasien": clusters.Gymnasium,
       "Gesamtschulen": clusters.Gesamtschule,
       "Berufskollegs": clusters.Berufskolleg,
       "Förderschulen": clusters.Förderschule,
       "Sonstige": clusters.Unbekannt
   }, {collapsed:false}).addTo(map);

   if (bounds.length) map.fitBounds(bounds);

})(); </script>