Widget:SchulkarteLeaflet - Versionsgeschichte

Christopher am 17. Dezember 2025 um 18:44 Uhr

2025-12-17T18:44:53Z

← Nächstältere Version		Version vom 17. Dezember 2025, 18:44 Uhr
Zeile 14:		Zeile 14:
	const filePath = (name) => '/wiki/Spezial:Dateipfad/' + encodeURIComponent(name);		const filePath = (name) => '/wiki/Spezial:Dateipfad/' + encodeURIComponent(name);
	const iconForType = {		const iconForType = {
	"Gymnasium": filePath('~~MarkerBlau~~.png'),		"Gymnasium": filePath('MarkerRot.png'),
	"~~Grundschule~~": filePath('~~MarkerRot~~.png')		"Volksschule": filePath('MarkerBlau.png')
	};		};
	const defaultIconUrl = filePath('~~Marker 11 rot~~.png');		const defaultIconUrl = filePath('MarkerBlau.png');

Christopher am 17. Dezember 2025 um 18:43 Uhr

2025-12-17T18:43:05Z

← Nächstältere Version		Version vom 17. Dezember 2025, 18:43 Uhr
Zeile 14:		Zeile 14:
	const filePath = (name) => '/wiki/Spezial:Dateipfad/' + encodeURIComponent(name);		const filePath = (name) => '/wiki/Spezial:Dateipfad/' + encodeURIComponent(name);
	const iconForType = {		const iconForType = {
	"Gymnasium": filePath('~~Marker 13 rot~~.png'),		"Gymnasium": filePath('MarkerBlau.png'),
	"Grundschule": filePath('~~Marker 11 rot~~.png')		"Grundschule": filePath('MarkerRot.png')
	};		};
	const defaultIconUrl = filePath('Marker 11 rot.png');		const defaultIconUrl = filePath('Marker 11 rot.png');

Christopher am 17. Dezember 2025 um 18:40 Uhr

2025-12-17T18:40:29Z

← Nächstältere Version		Version vom 17. Dezember 2025, 18:40 Uhr
Zeile 12:		Zeile 12:

	// Icons nach Schultyp		// Icons nach Schultyp
	const iconForType = {		const filePath = (name) => '/wiki/Spezial:Dateipfad/' + encodeURIComponent(name);
	"Gymnasium": ~~"{{filepath:~~Marker 13 rot.png~~}}"~~,		const iconForType = {
	"Grundschule": ~~"{{filepath:~~Marker 11 rot.png~~}}"~~		"Gymnasium": filePath('Marker 13 rot.png'),
	~~// weitere Typen ergänzen~~		"Grundschule": filePath('Marker 11 rot.png')
	};		};
	const defaultIconUrl = ~~"{{filepath:~~Marker 11 rot.png~~}}"~~;		const defaultIconUrl = filePath('Marker 11 rot.png');


	// JSON laden		// JSON laden

Christopher am 17. Dezember 2025 um 18:34 Uhr

2025-12-17T18:34:24Z

← Nächstältere Version		Version vom 17. Dezember 2025, 18:34 Uhr
Zeile 1:		Zeile 1:
	<div id="schulkarte" style="width:100%; height:500px;"></div>		<div id="schulkarte" style="width:100%; height:500px;"></div>

	<link		<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
	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 src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>

Zeile 10:		Zeile 7:
	(async function () {		(async function () {

	// 1) JSON-Quelle – OHNE mw.*		// SMW-API (bei Ihnen ohne /wiki/)
	const jsonUrl = '/~~wiki/index~~.php?~~title~~=~~Schulen/GeoJSON~~&~~action~~=~~raw~~';		const ask = '[[Kategorie:Schule]] [[Position::+]]\|?Position\|?Schultyp\|limit=5000';
			const jsonUrl = '/api.php?action=ask&format=json&query=' + encodeURIComponent(ask);

	// ~~2) Icon-Zuordnung~~ nach Schultyp		// Icons nach Schultyp
	const iconForType = {		const iconForType = {
	"Gymnasium": "{{filepath:Marker 13 rot.png}}",		"Gymnasium": "{{filepath:Marker 13 rot.png}}",
	"Grundschule": "{{filepath:Marker 11 rot.png}}"		"Grundschule": "{{filepath:Marker 11 rot.png}}"
			// weitere Typen ergänzen
	};		};
	const defaultIconUrl = "{{filepath:Marker 11 rot.png}}";		const defaultIconUrl = "{{filepath:Marker 11 rot.png}}";

	// 3) JSON laden		// JSON laden
	const resp = await fetch(jsonUrl);		const resp = await fetch(jsonUrl, { credentials: 'same-origin' });
			if (!resp.ok) throw new Error('SMW JSON nicht erreichbar: ' + resp.status);
	const data = await resp.json();		const data = await resp.json();

	// 4) Karte ~~initialisieren~~		// Leaflet Karte
	const map = L.map('schulkarte');		const map = L.map('schulkarte');
	L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {		L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
Zeile 33:		Zeile 33:
	const bounds = [];		const bounds = [];

	// ~~5) Marker setzen (defensiv!)~~		// Ergebnisse
	~~for (~~const ~~key in data.~~results~~) {~~		const results = (data && data.query && data.query.results) ? data.query.results : {};
	~~const r~~ = data.~~results[key];~~
	~~const pos = r~~.~~printouts~~.~~Position~~?.~~[0];~~
	~~if (!pos \|\| typeof pos~~.~~lat !== 'number' \|\| typeof pos.lon !== 'number')~~ {
	~~continue~~; ~~// kaputte Datensätze überspringen~~
	}

	const ~~typ~~ = r.printouts.~~Schultyp~~?.[0] \|\| '';		for (const key in results) {
			const r = results[key];
			const po = r.printouts \|\| {};
			const pos = (po.Position && po.Position[0]) ? po.Position[0] : null;

			// defensiv: ungültige Position überspringen
			if (!pos \|\| typeof pos.lat !== 'number' \|\| typeof pos.lon !== 'number') continue;

			const typ = (po.Schultyp && po.Schultyp[0]) ? String(po.Schultyp[0]) : '';
	const iconUrl = iconForType[typ] \|\| defaultIconUrl;		const iconUrl = iconForType[typ] \|\| defaultIconUrl;

Zeile 50:		Zeile 53:
	});		});

	const ~~marker~~ = L.marker([pos.lat, pos.lon], { icon })		const title = r.fulltext \|\| key;
			const url = r.fullurl \|\| ('/wiki/' + encodeURIComponent(title));

			L.marker([pos.lat, pos.lon], { icon })
	.addTo(map)		.addTo(map)
	.bindPopup(		.bindPopup(`<a href="${url}">${title}</a><br><b>Schultyp:</b> ${typ \|\| '-'}`);
	`<a href="${~~r.fullurl~~}">${~~r.fulltext~~}</a><br>~~` +~~
	`<b>Schultyp:</b> ${typ \|\| '-'}`
	);

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

	// 6) Zoom ~~setzen~~		// Zoom/Extent
	if (bounds.length) {		if (bounds.length) {
	map.fitBounds(bounds, { padding: [20, 20] });		map.fitBounds(bounds, { padding: [20, 20] });

Christopher: Neu ohne mw. Komponenten

2025-12-17T17:28:00Z

Neu ohne mw. Komponenten

← Nächstältere Version		Version vom 17. Dezember 2025, 17:28 Uhr
Zeile 1:		Zeile 1:
	<div id="schulkarte" style="width:100%; height:500px;"></div>		<div id="schulkarte" style="width:100%; height:500px;"></div>

			<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>		<script>
	(async function () {		(async function () {
	// 1) ~~Konfiguration:~~ JSON-Quelle ~~und Icon-Mapping~~
	const jsonUrl = ~~mw.util.wikiScript(~~'index~~') + '~~?title=Schulen/GeoJSON&action=raw';		// 1) JSON-Quelle – OHNE mw.*
			const jsonUrl = '/wiki/index.php?title=Schulen/GeoJSON&action=raw';

			// 2) Icon-Zuordnung nach Schultyp
	const iconForType = {		const iconForType = {
	"Gymnasium": "{{filepath:Marker 13 rot.png}}",		"Gymnasium": "{{filepath:Marker 13 rot.png}}",
	"Grundschule": "{{filepath:Marker 11 rot.png}}"		"Grundschule": "{{filepath:Marker 11 rot.png}}"
	~~// weitere Typen hier ergänzen~~
	};		};
	const defaultIconUrl = "{{filepath:Marker 11 rot.png}}";		const defaultIconUrl = "{{filepath:Marker 11 rot.png}}";

	~~// 2) Leaflet sicher laden (MediaWiki ResourceLoader)~~
	~~await mw.loader.using(['ext.leaflet']);~~

	// 3) JSON laden		// 3) JSON laden
	const resp = await fetch(jsonUrl~~, { credentials: 'same-origin' }~~);		const resp = await fetch(jsonUrl);
	const data = await resp.json();		const data = await resp.json();

Zeile 28:		Zeile 33:
	const bounds = [];		const bounds = [];

	// 5) ~~Ergebnisse durchlaufen~~		// 5) Marker setzen (defensiv!)
	~~const results = data && data.results ? data.results : {};~~		for (const key in data.results) {
	for (const key in results) {		const r = data.results[key];
	const r = results[key];		const pos = r.printouts.Position?.[0];
	const po = r.printouts ~~\|\| {};~~		if (!pos \|\| typeof pos.lat !== 'number' \|\| typeof pos.lon !== 'number') {
	~~const posArr = po~~.Position ~~\|\| [];~~		continue; // kaputte Datensätze überspringen
	~~const typeArr = po~~.~~Schultyp \|\|~~ [];

	~~// defensiv: ungültige/fehlende Position überspringen~~
	if (!~~posArr.length~~ \|\| typeof ~~posArr[0]~~.lat !== 'number' \|\| typeof ~~posArr[0]~~.lon !== 'number') {
	continue;
	}		}

	const ~~lat~~ = ~~posArr~~[0]~~.lat~~;		const typ = r.printouts.Schultyp?.[0] \|\| '';
	const ~~lon~~ = ~~posArr~~[~~0].lon;~~		const iconUrl = iconForType[typ] \|\| defaultIconUrl;
	~~const~~ typ ~~= (typeArr && typeArr.length) ? String(typeArr[0~~]~~) : ''~~;

	~~const iconUrl = iconForType[typ] \|\| defaultIconUrl;~~
	const icon = L.icon({		const icon = L.icon({
	iconUrl,		iconUrl,
Zeile 52:		Zeile 50:
	});		});

	const ~~title = r.fulltext \|\| key;~~		const marker = L.marker([pos.lat, pos.lon], { icon })
	~~const url~~ = ~~r.fullurl \|\| ('/wiki/' + encodeURIComponent(title));~~

	L.marker([lat, lon], { icon })
	.addTo(map)		.addTo(map)
	.bindPopup(`<a href="${~~url~~}">${~~title~~}</a><br><b>Schultyp:</b> ${typ \|\| '-'}`);		.bindPopup(
			`<a href="${r.fullurl}">${r.fulltext}</a><br>` +
			`<b>Schultyp:</b> ${typ \|\| '-'}`
			);

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

	// 6) ~~View~~ setzen		// 6) Zoom setzen
	if (bounds.length) {		if (bounds.length) {
	map.fitBounds(bounds, { padding: [20, 20] });		map.fitBounds(bounds, { padding: [20, 20] });
	} else {		} else {
	map.setView([50.94, 6.96], 12); ~~// Fallback (Köln grob)~~		map.setView([50.94, 6.96], 12);
	}		}

	})();		})();
	</script>		</script>

Christopher: Die Seite wurde neu angelegt: „