1
我編譯和調整這個演示腳本，學習跟蹤來自其他腳本部分的地理定位。到目前爲止這麼好...但clearWatch（）函數停止搜索或跟蹤沒有響應，因爲alert（）沒有顯示出來。Html5地理位置clearWatch（）沒有響應
我忘了什麼？
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 100% ; width:100%;}
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var previousPosition = null;
var startId;
var trackId;
function initialize() {
document.getElementById("info").innerHTML = "Je positie aan het zoeken...";
if (navigator.geolocation) {
startId = navigator.geolocation.watchPosition(function(position) {
var startPos = position;
var startAccuracy = startPos.coords.accuracy;
document.getElementById("info").innerHTML = "In de buurt... ca." + startAccuracy + " meter...";
if(startAccuracy < 3) {
document.getElementById("info").innerHTML = "Gevonden... binnen " + startAccuracy + " meter...";
map = new google.maps.Map(document.getElementById("map_canvas"), {
zoom: 18,
center: new google.maps.LatLng(startPos.coords.latitude, startPos.coords.longitude),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var marker = new google.maps.Marker({
position: new google.maps.LatLng(startPos.coords.latitude, startPos.coords.longitude),
map: map
});
navigator.geolocation.clearWatch(startId);
document.getElementById("info").innerHTML = "Tracking start over 5 seconden...";
setTimeout(function(){startTracking()},5000);
}
}, function(error) {
alert("Error code: " + error.code);
// error.code can be:
// 0: unknown error
// 1: permission denied
// 2: position unavailable (error response from locaton provider)
// 3: timed out
}, {maximumAge:1000, enableHighAccuracy: true});
}
else {
alert("GeoLocatie wordt niet ondersteund!");
}
}
function startTracking() {
document.getElementById("info").innerHTML = "Tracking is gestart...";
trackId = navigator.geolocation.watchPosition(successCallback, null, {maximumAge:1000, timeout:60000, enableHighAccuracy:true});
function successCallback(position){
map.panTo(new google.maps.LatLng(position.coords.latitude, position.coords.longitude));
if (previousPosition){
var newLineCoordinates = [
new google.maps.LatLng(previousPosition.coords.latitude, previousPosition.coords.longitude),
new google.maps.LatLng(position.coords.latitude, position.coords.longitude)];
var newLine = new google.maps.Polyline({
path: newLineCoordinates,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
newLine.setMap(map);
}
previousPosition = position;
};
}
function stopZoeken() {
navigator.geolocation.clearWatch(startId);
alert("Zoeken gestopt!");
}
function stopTracking() {
navigator.geolocation.clearWatch(trackId);
alert("Tracking gestopt!");
}
</script>
</head>
<body onload="initialize()">
<div id="info"></div>
<div><input type="button" onclick="stopZoeken()" value="Stop Zoeken" /> <input type="button" onclick="stopTracking()" value="Stop Tracking" /></div>
<div id="map_canvas"></div>
</body>
</html>