Prospekt getBounds() Rückkehr Longituden größer als 180

Question

schlug ich vor einem Problem, und der Autor schloß sie auf Github, aber ich bin immer noch ohne Abschluss verlassen. Longitudes reichen von -180 bis 180. Aber manchmal gibt Leaflet Longitudes wie 474.2578215 von getBounds() zurück, was dann natürlich nichts in meiner Datenbank zurückgibt.

Mir wurde gesagt: Es ist beabsichtigtes Verhalten. Das passiert, wenn Sie zu weit hinauszoomen und/oder die Karte auf eine andere Kopie der Welt ziehen, und getBounds Längen werden standardmäßig nicht umgebrochen. Sie können LatLng-Wrap-Methode verwenden, um zu bekommen, was Sie wollen - z. bounds.getSouthWest(). wrap().

Ok. Also habe ich die Wrap-Methode dort eingefügt, und die richtigen Daten werden zurückgegeben, aber jetzt werden keine Markierungen auf der Karte angezeigt. Dies liegt wahrscheinlich daran, dass sich die Markerpositionen nicht innerhalb dieses hohen Zahlenbereichs befinden. (Welcher Flugzettel denkt, ist die Koordinaten der Grenzen ...)

Ich bin nicht sicher, dass Zoom oder Ziehen die Ursache des Problems ist. Das Problem bleibt beim Aktualisieren der Seite bestehen, wenn der Benutzer keine Zoom- oder Ziehen-Ereignisse ausgeführt hat. Ich habe den Zoom in der init begrenzt mit: minZoom: 6, maxZoom: 13.

Ich sollte auch beachten, dass dieser Code (unverändert) verwendet nur gut zu funktionieren. Hier ist mein Code:

$(document).ready(function(){ initmap(); }); 

var map; 
var plotlist; 
var plotlayers=[]; 

function initmap(){ 
    // set up the map 
    map = new L.Map('map'); 

    //get our map 
    var osmUrl='http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'; 
    var osmAttrib='&copy; <a href = "http://www.openstreetmap.org/copyright"> OpenStreetMap </a> contributors'; 
    var osm = new L.TileLayer(osmUrl, {minZoom: 6, maxZoom: 13, 
      attribution: osmAttrib});  

    map.setView(new L.LatLng(<?=$slat;?>, <?=$slng;?>),9); 
    map.attributionControl.setPrefix(''); 
    map.addLayer(osm); 
    getGameMarkers(); 
    map.on('moveend', onMapMove); 
} 

    function onMapMove(e){ 
     getGameMarkers(); 
    } 

function getGameMarkers(){ 
    var center = map.getCenter(); 
    var zoo = map.getZoom(); 
    var bounds = map.getBounds(); 
    console.log(bounds); 

     var min = bounds.getSouthWest().wrap(); 
    var max = bounds.getNorthEast().wrap(); 

    $.ajax({type: "GET", url: "./ajax/markers.php", dataType: "json", data: "clat="+center.lat+"&clng="+center.lng+"&zoom="+zoo+"&minlat="+min.lat+"&minlng="+min.lng+"&maxlat="+max.lat+"&maxlng="+max.lng+cookiestr, 
    success: function(data){ 
     if (data.showmap == 1) { 
      plotlist = data.map_data;  
      removeMarkers(); 
      for (i=0;i<plotlist.length;i++) { 
       var iconic = String(plotlist[i].icon); 
       var plotmark = new L.marker([plotlist[i].lat,plotlist[i].lng], {icon: L.icon({iconUrl: iconic, iconSize: [32, 32]}) }).bindPopup(plotlist[i].html); 
       map.addLayer(plotmark); 
       plotlayers.push(plotmark); 
      } 

      $("#content").html(data.html); 
     }else { 
      $("#map_content").show(); 
      $("#map_content").html(data.main_content); 
      $("#content").html(data.side_content); 
     } 
     } 
     }); 
    } 

Die wrap() - Funktionen geben die richtigen Koordinaten, und der DB gibt die richtigen Plots zurück. Aber aus irgendeinem Grund werden sie nicht angezeigt. Hier sind die Grundstücke zurückgegeben (der map_data Teil):

map_data: [{lat:36.672825, lng:-76.541748, icon:./img/avicon3.png,…},…] 
      0: {lat:36.672825, lng:-76.541748, icon:./img/avicon3.png,…} 
      1: {lat:36.901314, lng:-76.041870, icon:./img/avicon2.png,…} 
      2: {lat:37.101192, lng:-76.264343, icon:./img/avicon3.png,…} 
      3: {lat:37.300274, lng:-75.673828, icon:./img/avicon3.png,…} 
      4: {lat:37.348328, lng:-76.830139, icon:./img/avicon3.png,…} 
      5: {lat:37.2481003, lng:-76.1194000, icon:./img/bicon3.png,…} 
      6: {lat:37.0298691, lng:-76.3452225, icon:./img/ricon.png,…} 
      7: {lat:37.6087608, lng:-77.3733063, icon:./img/ricon.png,…} 
      8: {lat:37.7440300, lng:-77.1316376, icon:./img/ricon.png,…} 
      9: {lat:37.5917015, lng:-77.4207993, icon:./img/bicon2.png,…} 
      10: {lat:37.5206985, lng:-77.3783112, icon:./img/ricon.png,…} 
      11: {lat:37.3306999, lng:-77.3227615, icon:./img/ricon.png,…} 
      12: {lat:37.1228981, lng:-75.9063034, icon:./img/bicon2.png,…} 

Keine Fehler in der Konsole, und wie gesagt, manchmal alles funktioniert (wenn getBounds nicht eine verrückte große LON zurückkehrt). Also was zum Teufel mache ich falsch und vor allem, wie löse ich es?

Answer 1

Dies liegt daran, dass WorldCopyJump standardmäßig auf false gesetzt ist. Setzen Sie es auf "True", und die Markierungen werden korrekt angezeigt, da sich die Welt nicht überschneidet.

Answer 2

Ich habe noch nie diese falschen Grenzen erfährt, sondern sie dienen als zumindest vorübergehende Lösung nicht programmaticly Begrenzung?

Was Marker nicht zeigt - kommt es, wenn Sie die Karte bewegen? Wenn es so ist, ist es sehr wahrscheinlich, dass sich 'moveend'-Ereignisse überschneiden. Ich weiß nicht, wie viele Punkte es im Durchschnitt gibt, aber wenn der Datendownload nicht endet und Marker hinzufügt, wird der nächste Aufruf von 'moveend' alle existierenden Marker löschen und anfangen, sie zu ersetzen (auch wird 'plotlist' überschrieben, was Ursache verursacht) Fehler später). Sie könnten versuchen, sie zur globalen Liste hinzuzufügen, nachdem alle Operationen beendet sind und Markierungen gezogen sind oder Sie nur Marker verschieben konnten, die nicht in der neuen Menge waren.

Auf Nebenbei bemerkt - warum nicht GeoJSON verwenden, um diese Schichten zu schaffen? Mit 'pointToLayer' und 'onEachFeature' können Sie Marker/Popups anpassen und haben am Ende eine Ebene, anstatt eine lange Liste von Markern.

Answer 3

Ich war eine ähnliche Sache zu sehen, es sei denn ich eine Karte Click-Ereignis über einen Rückruf als event.latlng.lng Verarbeitung wurde. Hinzufügen worldCopyJump: true taten nicht fix dieses Problem für mich - ich war noch zu sehen Länge Werte von mehr als 180

Am Ende rief ich die wrap() Methode zum latlng Objekt:

event.latlng.wrap().lng 

, die die festen Problem.