PhoneGap アプリケーションで OpenStreetMap を使用したいと考えています。
私の問題は、PhoneGap でクリック イベントが発生しないことです。
以下のコードは、通常のブラウザーで動作します。
<!DOCTYPE HTML>
<html>
<head>
<title>OpenLayers Demo</title>
<style type="text/css">
html, body, #basicMap {
width: 100%;
height: 100%;
margin: 0;
}
</style>
<script src="http://www.openlayers.org/api/OpenLayers.js"></script>
<script>
function init() {
map = new OpenLayers.Map("basicMap");
var mapnik = new OpenLayers.Layer.OSM();
var fromProjection = new OpenLayers.Projection("EPSG:4326"); // Transform from WGS 1984
var toProjection = new OpenLayers.Projection("EPSG:900913"); // to Spherical Mercator Projection
var position = new OpenLayers.LonLat(7.55785346031189,50.3625329673905).transform( fromProjection, toProjection);
var zoom = 18;
map.addLayer(mapnik);
map.setCenter(position, zoom );
var markers = new OpenLayers.Layer.Markers( "Markers" );
map.addLayer(markers);
var marker = new OpenLayers.Marker(position);
marker.events.register("click", map , function(e){ alert("click");
});
markers.addMarker(marker);
}
</script>
</head>
<body onload="init();">
<div id="basicMap"></div>
</body>
</html>
このコードを PhoneGap で地図を表示すると、地図が表示され、マーカーが表示されます。ただし、マーカーをクリックしても何も起こりません。
なぜこれが機能しないのか誰にもわかりません。私は Android Emulator を使用しており、Eclipse を使用して PhoneGapApplication を作成しています。