使用百度地图api获取地理位置

JS使用百度地图api获取地理位置

1.获取地图

参考文档:获取地图文档

1.1使用步骤:

1.2获取ak的步骤:

获取地址:获取ak

获取完成后:

1.3代码示例

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>使用百度地图api获取地理位置信息</title>
		<style type="text/css">
			html {
				height: 100%
			}
			
			body {
				height: 100%;
				margin: 0px;
				padding: 0px
			}
			
			#container {
				height: 100%
			}
		</style>
		// ak:为百度申请的ak
		<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=HpVGGX5OqiDCl32i8VucaD0UKC7rRuQ2"></script>
	</head>

	<body>
		<div id="container"></div>
		<script type="text/javascript">
			//			创建地图实例
			var map = new BMapGL.Map("container");
			//			设置中心点坐标
			var point = new BMapGL.Point(116.404, 39.915);
			//地图初始化,同时设置地图展示级别
			map.centerAndZoom(point, 40);
		</script>
	</body>

</html>

2.获取定位信息

提供的定位服务

接口类名说明
浏览器定位Geolocation优先调用浏览器H5定位接口,如果失败会调用IP定位
IP定位LocalCity根据用户IP 返回城市级别的定位结果
定位SDK辅助定位Geolocation当您的APP中有内置的Web页面,同时在Web页面需要提供您的当前位置信息时,可调用集成在App中的百度地图定位SDK来获取更精准的位置信息

参考网址:https://lbsyun.baidu.com/index.php?title=jspopularGL/guide/geoloaction

1.浏览器定位:

//			浏览器定位    allmap为div的di属性值
			var map = new BMapGL.Map("allmap");
				//			设置中心点坐标
			var point = new BMapGL.Point(116.331398, 39.897445);
			map.centerAndZoom(point, 12);

			var geolocation = new BMapGL.Geolocation();
			geolocation.getCurrentPosition(function(r) {
				if(this.getStatus() == BMAP_STATUS_SUCCESS) {
					var mk = new BMapGL.Marker(r.point);
					map.addOverlay(mk);
					map.panTo(r.point);
					alert('您的位置:' + r.point.lng + ',' + r.point.lat);
				} else {
					alert('failed' + this.getStatus());
				}
			});

2.IP定位:

	//			ip定位
			var map = new BMapGL.Map("allmap");
			var point = new BMapGL.Point(116.331398, 39.897445);
			map.centerAndZoom(point, 12);

			function myFun(result) {
				var cityName = result.name;
				map.setCenter(cityName);
				alert("当前定位城市:" + cityName);
			}
			var myCity = new BMapGL.LocalCity();
			myCity.get(myFun);

版权声明:本文为qq_41743601原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。