Html实现百度地图逆地址解析

最新推荐文章于 2024-08-16 22:57:43 发布

夏小白.

最新推荐文章于 2024-08-16 22:57:43 发布

阅读量350

点赞数

分类专栏：百度地图文章标签： html

本文链接：https://blog.csdn.net/xia1140418216/article/details/108132767

版权

百度地图专栏收录该内容

4 篇文章 0 订阅

订阅专栏

  <!DOCTYPE html>
  <html>
  <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
	body, html,#allmap {width: 100%;height: 100%;overflow:   hidden;margin:0;font-family:"微软雅黑";}
</style>
<script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=A30zzID7Nm83tGTTjgegr7IbzIOSjCYA"></script>
<title>地址解析</title>
  </head>
  <body>
<div id="allmap"></div>
  </body>
   </html>
  <script type="text/javascript">
// 百度地图API功能
var map = new BMap.Map("allmap");


var point = new BMap.Point(116.331398,39.897445);
map.centerAndZoom(point,12);

map.addEventListener("click",showInfo);

function showInfo(e){
	//拿到新的经纬度
	var lng = e.point.lng;
	var lat = e.point.lat;
	
	point = new BMap.Point(lng,lat);
}
// 创建地址解析器实例
var myGeo = new BMap.Geocoder();
// 将地址解析结果显示在地图上,并调整地图视野
myGeo.getPoint("北京市海淀区上地10街", function(point){
	if (point) {
		map.centerAndZoom(point, 16);
		map.addOverlay(new BMap.Marker(point));
	}else{
		alert("您选择地址没有解析到结果!");
	}
}, "北京市");
 </script>

夏小白.

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Html实现百度地图逆地址解析

<!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="initial-scale=1.0, user-scalable=no" /><style type="text/css"> body, html,#allmap..
复制链接

扫一扫

专栏目录