Zentrierung aktueller POI

Guten Abend,

ich habe eine OSM-Karte erstellt. Ich habe verschiedene POIs in einer Datenbank gespeichert und möchte nun, dass der ausgewählte POI immer zentriert auf dem Kartenausschnitt dargestellt wird.

Mein momentaner statischer Code zur Anzeige des Mittelpunktes der Karte sieht folgendermaßen aus:


var map = L.map('map').setView([01.2345678, 12.3456789], 14);

Ich wollte die statischen Werte jetzt durch Variablen aus meiner Datenbank ersetzen:


var map = L.map('map').setView([$line["lat"], $line["lon"]], 14);

Das funktioniert aber leider irgendwie nicht. Kann mir hierbei jemand weiterhelfen?

Dann habe ich noch eine 2. Frage:
Ich möchte auf einer weiteren Karte alle POIs auf einmal darstellen. Nun soll der Kartenausschnitt automatisch mit der entsprechenden Vergrößerung geöffnet werden, damit alle POIs ohne zu Zoomen dargestellt werden. Ist dies überhaupt möglich? Wenn ja wäre ich über etwas Hilfe dazu dankbar.

LG
fox_bw

Zu 1: Bist Du dir sicher, dass zum Zeitpunkt der Erzeugung der Karte bereits sinnvolle Werte in $line[“lat”] und $line[“lon”] stehen? Im Zweifel mal eine Zeile vorher mit alert() ausgeben lassen oder mit Debugger ansehen. Falls die Variablen erst später Werte bekommen, kann man auch erst nach dem Einlesen der Koordinaten die Karte mit map.setView([lat lon], zoom) dorthin verschieben.

Zu 2: Kommt drauf an, wie du deine POIs organisierst. Irgendwas mit getBounds() und fitBounds() könnte passen.

Grüße
Max

Hallo max,

vielen Dank für deine Antwort.
Meine 1. Frage hat sich gelöst. Es war ein Problem in der Übergabe der Variablen von PHP nach JS.
Deine Ausführungen zu 2. verstehe ich noch nicht so ganz. Was meinst du mit “organisierst”? Meine POI samt Geodaten in einer Datenbank. Von dort aus werden Sie aufgerufen; es findet also nicht jedes mal eine Geokoordinaten-Abfrage bei OSM statt. Kann jemand hier vielleicht mir noch etwas weietrhelfen? Hatt jemand vielleicht schon mal das gleiche oder ähnliche Problem?

LG
Fox_bw

Das ist kein Problem, jedoch abhängig davon wie du deine POI organisierst :slight_smile: (siehe Antwort von Max). Also, ob du die Marker einzeln auf die Karte schmeißt oder als Layergroup oder als …

Prinzipiell mußt du feststellen, in welchem Bereich die Marker liegen, damit kannst du die Karte zentrieren, sodass alle Marker sichbar sind. Z.B. http://leafletjs.com/reference.html#latlngbounds-%0A%09%09%09l.latlngbounds und dort die Methode “extend”.

Pseudocode:

llbounds = L.latLngBounds()

foreach marker
  llbounds.extend(marker.getLatLng()

map.fitBounds(llbounds)