<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>獲取當(dāng)前位置并顯示在google地圖上</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function init() {
if (navigator.geolocation) {
//獲取當(dāng)前地理位置
navigator.geolocation.getCurrentPosition(function (position) {
var coords = position.coords;
//console.log(position);
//指定一個google地圖上的坐標(biāo)點，同時指定該坐標(biāo)點的橫坐標(biāo)和縱坐標(biāo)
var latlng = new google.maps.LatLng(coords.latitude, coords.longitude);
var myOptions = {
zoom: 14, //設(shè)定放大倍數(shù)
center: latlng, //將地圖中心點設(shè)定為指定的坐標(biāo)點
mapTypeId: google.maps.MapTypeId.ROADMAP //指定地圖類型
};
//創(chuàng)建地圖，并在頁面map中顯示
var map = new google.maps.Map(document.getElementById("map"), myOptions);
//在地圖上創(chuàng)建標(biāo)記
var marker = new google.maps.Marker({
position: latlng, //將前面設(shè)定的坐標(biāo)標(biāo)注出來
map: map //將該標(biāo)注設(shè)置在剛才創(chuàng)建的map中
});
//標(biāo)注提示窗口
var infoWindow = new google.maps.InfoWindow({
content: "當(dāng)前位置：<br/>經(jīng)度：" + latlng.lat() + "<br/>維度：" + latlng.lng() //提示窗體內(nèi)的提示信息
});
//打開提示窗口
infoWindow.open(map, marker);
},
function (error) {
//處理錯誤
switch (error.code) {
case 1:
alert("位置服務(wù)被拒絕。");
break;
case 2:
alert("暫時獲取不到位置信息。");
break;
case 3:
alert("獲取信息超時。");
break;
default:
alert("未知錯誤。");
break;
}
});
} else {
alert("你的瀏覽器不支持HTML5來獲取地理位置信息。");
}
}
</script>
</head>
<body onload="init()">
<div id="map" style="width: 800px; height: 600px"></div>
</body>
</html>
