マップ上のタップ/クリックの位置をキャプチャして座標を保存する必要があるマップを含むページをプログラミングしています。OpenLayers js を使用しています。デスクトップ ブラウザ (IE/FF/Chrome) では、これは正常に動作します。モバイル デバイスでは、デフォルトの Android ブラウザー (実際のデバイスとエミュレーターの両方) でタップが正しくキャプチャされます。
ただし、モバイル Webkit ブラウザー (iPhone Safari および Android Chrome ベータ版) では、タップが実際のタップより数ピクセル高い (北に向かって) キャプチャされるという問題があります。エラーは修正されていません (そのため、イベントの xy に 100 を追加して上部を再調整することはできません)。
クリックハンドラとして使用しているコードは次のとおりです。
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);
}
});
私は何か違うことをするべきですか?OpenLayers を使用しているときに、モバイル Webkit ブラウザーで不正確な問題を見た人はいますか?