网页定位听起来真的很帅，如果一个简简单单的网页就能解决定位问题，那我们还要那些定位软件干嘛呢？
不过这次的网页只能实现定位，有兴趣的读者可以尝试开发一下导航网页。
直接上代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>地理定位</title>
<style>
#map{
width:600px;
height:600px;
Border:2px solid red;
}
</style>
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false">
</script>
<script>
function findyou(){
if(!navigator.geolocation.getCurrentPosition(showPosition,noLocation,{maximumAge : 1200000, timeout : 30000})){
document.getElementById("lat").innerHTML=
"This browser does not support geolocation. "
}
}
function showPosition(location){
var latitude = location.coords.latitude;
var longitude = location.coords.longitude;
var accuracy = location.coords.accuracy;
var position = new google.maps.LatLng(latitude, longtiyude);
var myOptions = {
zoom: 18,
center: position,
mapTypeTd: google.maps.MapTypeId.HYBRID
};
var map = new google.maps.Map(document.getElementById("map"),myOptions);
document.getElementById("lat").innerHTML=
"Your latitude is " + latitude;
document.getElementById("lon").innerHTML=
"Your longtitude is " + longitude;
document.getElementById("acc").innerHTML=
"Acurate within " + accuracy + " meters";
}
function noLocation(locationError)
{
var errorMessage = document.getElementById("lat");
switch(locationError.code)
{
case locationError.PERMISION_DENIED:
errorMessage.innerHTML=
"You have denied my request for your location. ";
break;
case locationError.POSITION_UNAVALABLE:
errorMessage.innerHTML=
"Your position is not available at this time. ";
break;
case locationError.TIMEOUT:
errorMessage.innerHTML=
"My request for your location took too long. ";
break;
default:
errorMessage.innerHTML=
"An unexpected error ocurred. ";
}
findYou();
}
</script>
</head>
<body>
<h1>找到你啦！</h1>
<p id="lat"> </p>
<p id="lon"> </p>
<p id="acc"> </p>
<div id="map">
</div>
</body>
</html>这个网页主要引进了一个地图，实现了双重精度的定位，可以说是非常精准了。即使你远在美国，你也可以直接定位。
没多少行，便可以实现。不过值得注意的是，这个定位网页用了谷歌的地图，而非本人创作的地图，有读者会做地图的可以评论一下，我们下期继续改进！