osm: Navigation auf Bild mit map-Verlinkungen

Beitrag lesen

Schau mal hier zum Einlesen und Ausprobieren: http://osmer.de/leaflet/

Im Moment hakt es noch, weil ich den Hallenplan nach Süden (unten) aus seinem Rahmen rausschieben und dann nicht mehr "greifen" kann. Soll wohl ein Bug seit Jahren sein.

Hallo Linuchs,

also bei mir funktioniert folgender Code wie erwartet:

<!DOCTYPE HTML>
<html lang="de">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
</head>
<body>
<div id="lageplan" style="width:1114px; height:522px;"></div>
</div>
<script type='text/javascript'>
	var bounds = Object.create([[0, 0],[522,1114]]);
	var map = L.map('lageplan', {
		crs: L.CRS.Simple,
		maxBounds: bounds
	});
	map.fitBounds(bounds);
	var PlanLayer = L.imageOverlay('hallenplan.jpg', bounds).addTo(map);
</script>

</body>
</html>

P.S.

Man kann denn Layer auch bewegen, wenn der Plan ausserhalb des sichtbaren Bereichs ist, das ist allerdings nicht sehr hilfreich, wenn man nicht weiss in welche Richtung.

Und zur Frage in deiner Anleitung, warum in leaflet x- und y-Wert bei der Koordinatenangabe vertauscht sind:

Leaftlet ist ja für Darstellung im geografischen Umfeld gedacht. Dort ist die Reihenfolge mit dem vertikalen Wert (y = geografische Breite = lat) an erster Stelle üblich und in einer ISO-Norm festgelegt. Du kannst ja mal die Koordinate 8.478549, 49.898743 in das Suchfeld deiner bevorzugten Online-Karte eingeben und dann entscheiden, ob Du dort jetzt lieber wärst.