前言
今天看了一点html5,发现它相对于html添加了很多新特性,比如画布,可以播放视频音频等。但是我印象比较深刻的是这个地理定位,html5中有一个geolocation API,通过它可以获取当前我的位置。所以我动手实践了一下。这个接口需要的浏览器支持是:Internet Explorer 9、Firefox、Chrome、Safari 以及 Opera。我使用的是Chorme。
使用百度API
由于我是想在地图中显示我的位置,所以需要引入地图。这里我使用了百度地图的API。首先看一下能否成功。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>测试html5地理定位</title>
<script src="http://api.map.baidu.com/api?v=1.2"></script>
<script type="text/javascript">
function initialize(){
//初始化地图
var map = new BMap.Map("map");
//确定中心点,这里我使用的是苏州独墅湖某点
var point = new BMap.Point(120.730435, 31.273391);
//在地图中将中心点定位到point,地图级别为15
map.centerAndZoom(point, 15);
map.addControl(new BMap.NavigationControl());
}
window.onload = initialize;
</script>
</head>
<body>
<div id="map" style="width:400px;height:400px"></div>
</body>
</html>
可以得到结果以point为中心的一块区域