Widget:LeafletSMWMap: Unterschied zwischen den Versionen
Aus Altes Köln
Keine Bearbeitungszusammenfassung |
Keine Bearbeitungszusammenfassung |
||
| Zeile 31: | Zeile 31: | ||
'/wiki/Spezial:Dateipfad/' + encodeURIComponent(defIcon); | '/wiki/Spezial:Dateipfad/' + encodeURIComponent(defIcon); | ||
//temporäres Debugging | //temporäres Debugging einschl. const data | ||
const resp = await fetch(jsonUrl, { credentials: 'same-origin' }); | const resp = await fetch(jsonUrl, { credentials: 'same-origin' }); | ||
const text = await resp.text(); | const text = await resp.text(); | ||
console.log('JSON-URL:', jsonUrl); | console.log('JSON-URL:', jsonUrl); | ||
console.log('RAW JSON (erste 500 Zeichen):', text.slice(0, 500)); | console.log('RAW JSON (erste 500 Zeichen):', text.slice(0, 500)); | ||
Version vom 17. Dezember 2025, 19:49 Uhr
<link rel="stylesheet"
href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script> (async function () {
// const jsonUrl = '{{{json}}}';
const ask = ' Die folgende Koordinate wurde nicht erkannt: +.|?Position|?Schultyp|limit=50';//nur testweise const jsonUrl = '/api.php?action=ask&format=json&query=' + encodeURIComponent(ask);//nur testweise
const posProp = '{{{position}}}';
const typeProp = '{{{type}}}';
const iconSpec = '{{{iconMap}}}';
const defIcon = '{{{defaultIcon}}}';
// Icon-Mapping "Typ=Datei.png;Typ2=Datei2.png"
const iconMap = {};
iconSpec.split(';').forEach(pair => {
const [k,v] = pair.split('=');
if (k && v) {
iconMap[k.trim()] =
'/wiki/Spezial:Dateipfad/' + encodeURIComponent(v.trim());
}
});
const defaultIcon =
'/wiki/Spezial:Dateipfad/' + encodeURIComponent(defIcon);
//temporäres Debugging einschl. const data
const resp = await fetch(jsonUrl, { credentials: 'same-origin' });
const text = await resp.text();
console.log('JSON-URL:', jsonUrl); console.log('RAW JSON (erste 500 Zeichen):', text.slice(0, 500));
const data = JSON.parse(text); console.log('PARSED DATA:', data); //Ende temporäres Debugging
const map = L.map('smwmap');
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
{ maxZoom: 19, attribution: '© OpenStreetMap' }
).addTo(map);
const bounds = [];
const results = data.query?.results || {};
for (const key in results) {
const r = results[key];
const pos = r.printouts?.[posProp]?.[0];
if (!pos || typeof pos.lat !== 'number') continue;
const type = r.printouts?.[typeProp]?.[0] || ; const iconUrl = iconMap[type] || defaultIcon;
const icon = L.icon({
iconUrl, iconSize:[24,24], iconAnchor:[12,24]
});
L.marker([pos.lat, pos.lon], { icon })
.addTo(map)
.bindPopup(
`<a href="${r.fullurl}">${r.fulltext}</a>
${type}`
);
bounds.push([pos.lat, pos.lon]); }
bounds.length ? map.fitBounds(bounds,{padding:[20,20]})
: map.setView([50.94,6.96],12);
})(); </script>
