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

通过html5获取地理位置信息

2014-12-30 15:11 489 查看

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>2</title>

</head>

<body>

<center>

<div style="position:fixed;left:40%;top:40%;"><p id="demo"><font size="5">点击这个按钮，获得您的位置：</font></p>

<span id="dis"></span><br>

<input type="button" onclick="getLocation()" style="height:100px;width:200px;" value="试一下"></input>

</div>

</center>

<script src="http://api.map.baidu.com/api?v=1.4" type="text/javascript"></script>

<script>

var x=document.getElementById("demo");

function getLocation(){

if(navigator.geolocation){

navigator.geolocation.getCurrentPosition(showPosition);

}else{

alert("您的浏览器不支持地理定位");

}

}

function showPosition(position){

lat=position.coords.latitude;

lon=position.coords.longitude;

document.getElementById('dis').innerHTML= "你的经度："+lon+",你的纬度："+lat;

//var map = new BMap.Map("container"); // 创建Map实例

var point = new BMap.Point(lon, lat); // 创建点坐标

//map.centerAndZoom(point,15); //

//map.enableScrollWheelZoom();

var gc = new BMap.Geocoder();

gc.getLocation(point, function(rs){

var addComp = rs.addressComponents;

alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street);

});

}

</script>

</body>

</html>

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

标签： html5 获取地址

相关文章推荐

新的分享

章节导航