我目前正在使用 Phonegap 进行开发,并且我在使用 google API for maps 时遇到了一些问题。
好吧,它在网络导航器上运行正确,但是每次我在模拟器上翻译它时,都会显示页面,但不会显示地图......而且我在控制台或 logcat 中没有任何错误消息。
我已经对Eclipse 进行了所有的自动化操作,但我不明白为什么它不起作用。
这是我的代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Esprit Citoyen</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<link href="css/jquery.mobile.css" rel="stylesheet" />
<link href="css/index.css" rel="stylesheet" />
<script type="text/javascript" src="js/perso.js"></script> <!-- Affichage de la carte et gestion des pointeurs -->
<script type="text/javascript" charset="utf-8" src="js/cordova-2.8.1.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.mobile.js"></script>
<script type="text/javascript">
function deviceReday(){
document.addEventListener("deviceready", afunction, false);
}
function afunction(){
geolocalisation()
}
var contentMarker;
var lattitude; //y
var longitude; //x
</script>
</head>
<body onload="deviceReday()">
<!--<body onload="geolocalisation()">-->
<div data-role="page" data-theme="b">
<div data-role="header" data-theme="b" class="center-wrapper"></div>
<div data-role="content">
<div id="id1">
<div class="center-wrapper">
<div class="etape">Title</div><br/><br/>
<div id="carte" style="width:500px; height:300px;" data-theme="c"></div>
</div>
</div>
</div>
<div data-role="footer" data-theme="c"></div>
</div>
</body>
</html>
对于 js 部分:
function geolocalisation() {
navigator.geolocation.getCurrentPosition(initialiser, onError, {timeout:10000, enableHighAccuracy: false});
}
function onError(error) {
console.log(error);
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');
}
function initialiser(position) {
lattitude = position.coords.latitude;
longitude = position.coords.longitude;
var latlng = new google.maps.LatLng(lattitude, longitude);
var geocoder= new google.maps.Geocoder();
var options = {
center: latlng,
zoom: 15,
mapTypeId: google.maps.MapTypeId.ROADMAP,
streetViewControl: false,
mapTypeControl: false
};
var carte = new google.maps.Map(document.getElementById("carte"), options);
var marqueur = new google.maps.Marker({
position: latlng,
map: carte
});
marqueur.setDraggable(true);
google.maps.event.addListener(marqueur, 'dragend', function(event) {
lattitude = event.latLng.lat();
longitude = event.latLng.lng();
console.log("long : " + lattitude + " lat : "+ longitude);
latlng = new google.maps.LatLng(lattitude, longitude)
geocoder.geocode({'latLng': latlng}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
contentMarker = results[0].formatted_address;
infoWindow.setContent(contentMarker);
}else {
alert("Geocoder failed due to: " + status);
}
});
});
var infoWindow = new google.maps.InfoWindow({
content : contentMarker,
position : new google.maps.LatLng(lattitude, longitude)
});
google.maps.event.addListener(marqueur, 'click', function() {
geocoder.geocode({'latLng': latlng}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
contentMarker = results[0].formatted_address;
infoWindow.setContent(contentMarker);
}else {
alert("Geocoder failed due to: " + status);
}
});
infoWindow.open(carte,marqueur);
});
}
欢迎任何帮助:)