Widget:Leaflet

<script id="smw-data" type="application/json"> JSON </script>

<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(){

   // JSON aus Scriptblock holen
   var raw = document.getElementById('smw-data').textContent.trim();

   // Debug: zeige den rohen SMW-Output auf der Seite
   document.getElementById('debug').textContent = raw;

   // JSON sicher parsen
   var schoolData = [];
   try {
       schoolData = JSON.parse(raw);
   } catch(e) {
       console.error("JSON-Fehler:", e, raw);
       return;
   }

   // Karte erstellen
   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:'© OpenStreetMap contributors'
   }).addTo(map);

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

   var bounds = [];

   // Marker erzeugen
   schoolData.forEach(function(s){
       if (!s.coords) return;

       var parts = s.coords.split(',');
       if (parts.length !== 2) return;

       var lat = parseFloat(parts[0]);
       var 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);

       var group = clusters[type] || clusters.Unbekannt;
       group.addLayer(marker);

       bounds.push([lat, lon]);
   });

   // Alle Cluster zur Karte hinzufügen
   Object.values(clusters).forEach(function(g){
       map.addLayer(g);
   });

   // Layer-Steuerung
   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);

   // Kartenausschnitt automatisch anpassen
   if (bounds.length) {
       map.fitBounds(bounds);
   }

})(); </script>