您的位置：首页 > Web前端 > HTML5

HTML5获取地理位置信息

2017-08-31 09:49 351 查看

<!DOCTYPE html>
<html
lang="en">

<head>
<title>Geolocation API</title>
<meta
charset="UTF-8">
<meta
name="viewport"
content="width=device-width, initial-scale=1">
<script
src="http://maps.google.com/maps/api/js?sensor=false"></script>
</head>

<body>
<div
id="map" style="width:400px;height:400px;border:1px solid gray"></div>
<script>
function showObject(obj,
k) {
//递归显示object
if (!obj) {
return;
}
for (var i in obj) {
if (typeof(obj[i]) !=
"object" || obj[i] == null) {
for (var j =
0; j < k; j++) {
document.write(" ");
}
document.write(i +
":" + obj[i] + "<br/>");
} else {
document.write(i +
":" + "<br/>");
showObject(obj[i], k +
1);
}
}
}

function get_location() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(show_map, handle_error, {
enableHighAccuracy: true,
maximumAge: 1000
});
} else {
alert("浏览器不支持html5获取地理位置信息");
}
}

function handle_error(err) {
// 错误处理
switch (err.code) {
case 1:
alert("位置服被拒绝");
case 2:
alert("暂时获取不到位置信息");
case 3:
alert("获取信息超时");
case 4:
alert("未知错误");
}
}

function show_map(position) {
//显示地理信息
var latitude =
position.coords.latitude;
var longitude =
position.coords.longitude;
showObject(position,
0);
}
get_location();
</script>

</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航