2012-05-07 18 views
6

Programuję stronę z mapą, w której potrzebuję uchwycić położenie dotknięcia/kliknięcia na mapie i zapisać współrzędne. Korzystam z jamy OpenLayers. W przeglądarkach na komputery (IE/FF/Chrome) działa to dobrze. Na urządzeniach mobilnych pobieranie odbywa się poprawnie w domyślnej przeglądarce Androida (zarówno w rzeczywistych urządzeniach, jak i na emulatorach).OpenLayers szerokość geograficzna niepoprawnie uchwycona w przeglądarkach Webkit Mobile

Jednak w przeglądarkach mobilnego webkita (iPhone Safari & Android Chrome Beta) mamy problem z przechwytywaniem kranu o kilka pikseli wyżej (w kierunku północnym) od rzeczywistego odczepu. Błąd nie jest stały (tak, nie mogę tylko dodać 100 do xy imprezy ponowna kalibracja szczyt.)

Oto kod używam jako clickHandler:

OpenLayers.Control.ClickHandler = OpenLayers.Class(OpenLayers.Control, {     
    defaultHandlerOptions: { 
     'single': true, 
     'double': false, 
     'pixelTolerance': 0, 
     'stopSingle': false, 
     'stopDouble': false 
    }, 

    initialize: function(options) { 
     this.handlerOptions = OpenLayers.Util.extend(
      {}, this.defaultHandlerOptions 
     ); 
     OpenLayers.Control.prototype.initialize.apply(
      this, arguments 
     ); 
     this.handler = new OpenLayers.Handler.Click(
      this, { 
       'click': this.trigger 
      }, this.handlerOptions 
     ); 
    }, 

    trigger: function(e) { 
     that.inputLonLat_EPSG4326 = null; 

     var lonlat = that.inputMap.getLonLatFromViewPortPx(e.xy); 

     that.logMessage("XY " + e.xy); 
     that.logMessage("LonLoat " + lonlat); 

     that.inputMarkers.clearMarkers(); 


    that.inputMarkers.addMarker(new OpenLayers.Marker(lonlat,that.icons["green"].clone())); 

    lonlat.transform(that.inputMap.getProjectionObject(), new OpenLayers.Projection("EPSG:4326")); 

    that.inputLonLat_EPSG4326 = lonlat; 
    // For the moderation sections 
    $('#alertLatitude').val(that.inputLonLat_EPSG4326.lat); 
    $('#alertLongitude').val(that.inputLonLat_EPSG4326.lon); 

    //lonLat2.transform(that.inputMap.getProjectionObject(), new OpenLayers.Projection("EPSG:4326")); 
    that.logMessage("Stored lat " + that.inputLonLat_EPSG4326.lat); 
    that.logMessage("Stored lon " + that.inputLonLat_EPSG4326.lon);  

    that.callFunction(that.inputMapListener, e); 
    } 
}); 

Byłbym robiąc coś inaczej? Czy ktoś jeszcze widział problem niedokładności w przeglądarkach mobilnej przeglądarki podczas korzystania z OpenLayers?

Odpowiedz

1

W końcu znalazłem przyczynę tego. Wygląda na to, że na przenośnych przeglądarkach web x, y, które biblioteka wydaje się uzyskiwać (lub czerpać) opiera się na stronie, a nie na elemencie, w którym znajduje się mapa. Dlatego obliczenia są wyłączone. Wydaje się, że niedokładności nie można rozwiązać, dodając xy elementu mapy lub jakiejś takiej postaci opartej na modelu DOM (próbowałem).

Rozwiązałem ją, umieszczając mapę w ramce, a następnie iFrame mieści się w elemencie mapy. W ten sposób x, y otrzymane przez funkcję obsługi kliknięć na mapie jest dokładne w ramach iFrame, a tym samym długa, długa jest również dokładna. Ponieważ zarówno element nadrzędny, jak i element iFrame pochodzą z tej samej domeny, nie występują problemy z komunikacją powrotną.

Aby dokończyć kontekst, rozwiązanie oparte na iFrame jest zdecydowanie zgodne z powyższym BB 9 &, Androidem Chrome, Androidem domyślnym i iPhonem Safari, jak przetestowałem.

Sprawdź rozwiązania w - http://suat1.vocanic.net//saralee/apps/dengue_alert/ i iFrame na http://suat1.vocanic.net//saralee/apps/dengue_alert/mobileMap.php (wersje WIP ulec zmianie lub zerwać z czasu)