google map 得到用户地理位置信息

haitian235

浏览: 61177 次
性别:
来自: 海南

最近访客更多访客>>

bianlong

sunny8675

nalon

zldjjf50

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

解析：
首先通过w3c Geolocation 标准得到位置信息，此标准是html5的一部分。如果浏览器不支持w3c Geolocation标准，再通过google gears软件得到位置信息，gears是一款支持离线工作的软件。
Google Gears有几个主要的API组件：
　　一个本地服务器，用来存储和读取离线程序资源（包括HTML, JavaScript, images等）。
　　一个小型数据库（以SQLite构建），用来储存本地数据。
　　一个工作池，用来让开发者将本地数据与服务器端后台同步。
　　一个桌面模型可使网络程序的操作贴近桌面程序。
　　一个地理定位模型，能够让网络程序侦测到目前用户的地理位置。

源码：
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: Map Geolocation</title>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script type="text/javascript" src="http://code.google.com/apis/gears/gears_init.js"></script>
<script type="text/javascript">

var initialLocation;
var siberia = new google.maps.LatLng(60, 105);
var newyork = new google.maps.LatLng(40.69847032728747, -73.9514422416687);
var browserSupportFlag = new Boolean();
var map;
var infowindow = new google.maps.InfoWindow();

function initialize() {
var myOptions = {
    zoom: 6,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

// Try W3C Geolocation method (Preferred)
if(navigator.geolocation) {
    browserSupportFlag = true;
    navigator.geolocation.getCurrentPosition(function(position) {
      initialLocation = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
      contentString = "Location found using W3C standard";
      map.setCenter(initialLocation);
      infowindow.setContent(contentString);
      infowindow.setPosition(initialLocation);
      infowindow.open(map);
    }, function() {
      handleNoGeolocation(browserSupportFlag);
    });
} else if (google.gears) {
    // Try Google Gears Geolocation
    browserSupportFlag = true;
    var geo = google.gears.factory.create('beta.geolocation');
    geo.getCurrentPosition(function(position) {
      initialLocation = new google.maps.LatLng(position.latitude,position.longitude);
      contentString = "Location found using Google Gears";
      map.setCenter(initialLocation);
      infowindow.setContent(contentString);
      infowindow.setPosition(initialLocation);
      infowindow.open(map);
    }, function() {
      handleNoGeolocation(browserSupportFlag);
    });
} else {
    // Browser doesn't support Geolocation
    browserSupportFlag = false;
    handleNoGeolocation(browserSupportFlag);
}
}

function handleNoGeolocation(errorFlag) {
if (errorFlag == true) {
    initialLocation = newyork;
    contentString = "Error: The Geolocation service failed.";
} else {
    initialLocation = siberia;
    contentString = "Error: Your browser doesn't support geolocation. Are you in Siberia?";
}
map.setCenter(initialLocation);
infowindow.setContent(contentString);
infowindow.setPosition(initialLocation);
infowindow.open(map);
}
</script>
</head>
<body onload="initialize()">
<div id="map_canvas"></div>

</body>
</html>

分享到：