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>

<script>

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

// === SMW ASK Platzhalter (MediaWiki füllt das automatisch) ===

	Koordinaten	Schultyp	link
Albertus-Magnus-Gymnasium		Gymnasium
Apostelgymnasium		Gymnasium
Bildung in Köln
Deutzer Gymnasium Schaurtestraße		Gymnasium
Dreikönigsgymnasium		Gymnasium
Elisabeth-von-Thüringen-Gymnasium		Gymnasium
Erich Kästner-Gymnasium		Gymnasium
Erzbischöfliche Ursulinenschule		Gymnasium
Friedrich-Wilhelm-Gymnasium		Gymnasium
Genoveva-Gymnasium		Gymnasium
Gymnasium Kreuzgasse		Gymnasium
Gymnasium Laurentianum		Gymnasium
Gymnasium Montanum		Gymnasium
Hansagymnasium		Gymnasium
Humboldt-Gymnasium		Gymnasium
Höhere Bürgerschule
Infobox Schule
Kaiser-Wilhelm-Gymnasium		Gymnasium
Kaiserin-Augusta-Schule		Gymnasium
Kaiserin-Theophanu-Schule		Gymnasium
Katholische Volksschule Georgstraße		Volksschule
Königin-Luise-Schule		Gymnasium
Rhein-Gymnasium		Gymnasium
Schiller-Gymnasium		Gymnasium
Schule
Schulen in Köln
Schulen in Köln/Bezirk 1
Schulen in Köln/Bezirk 2
Schulen in Köln/Bezirk 3
Schulen in Köln/Bezirk 4
Schulen in Köln/Bezirk 5
Schulen in Köln/Bezirk 6
Schulen in Köln/Bezirk 7
Schulen in Köln/Bezirk 8

// Marker setzen schoolData.forEach(function(school){

   if(!school.Koordinaten) return;

   var coords = school.Koordinaten.split(',');
   var lat = parseFloat(coords[0]);
   var lon = parseFloat(coords[1]);

   var marker = L.marker([lat, lon])
       .bindPopup('' + school.link + '
' + school.Schultyp);

   switch(school.Schultyp){
       case "Grundschule":      layerGrund.addLayer(marker); break;
       case "Gymnasium":        layerGym.addLayer(marker); break;
       case "Gesamtschule":     layerGes.addLayer(marker); break;
       case "Berufskolleg":     layerBeruf.addLayer(marker); break;
       case "Förderschule":     layerFoerder.addLayer(marker); break;
       default:                 layerGrund.addLayer(marker);
   }

});

// Default Layer anzeigen layerGrund.addTo(map); layerGym.addTo(map);

// Layer Control (Legende) var overlays = {

   "Grundschulen": layerGrund,
   "Gymnasien": layerGym,
   "Gesamtschulen": layerGes,
   "Berufskollegs": layerBeruf,
   "Förderschulen": layerFoerder

};

L.control.layers(null, overlays, {collapsed:false}).addTo(map);

</script>