html5地理应用+google map获取当前位置
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="jquery-1.8.0.js"></script>
<script type="text/javascript">
function runMap(lat, lng) {
var latlng = new google.maps.LatLng(lat, lng);
var myOptions = {
zoom: 15,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map-canvas"), myOptions);
}
$(function () {
var lat,
lng;
//try to get GPS coords
if (navigator.geolocation) {
//redirect function for successful location
function gpsSuccess(pos) {
if (pos.coords) {
lat = pos.coords.latitude;
lng = pos.coords.longitude;
runMap(lat, lng);
}
else {
lat = pos.latitude;
lng = pos.longitude; runMap(lat, lng);
}
}
function gpsFail() {
//Geo-location is supported, but we failed to get your coordinates. Workaround here perhaps?
}
navigator.geolocation.getCurrentPosition(gpsSuccess, gpsFail, { enableHighAccuracy: true, maximumAge: 300000 });
}
})
</script>
</head>
<body>
<div id="map-canvas" style="height: 800px; width: 800px;"></div>
<script type="text/javascript">
</script>
</body>
</html>
