百度地图 JavaScript 浏览器定位获取当前位置信息（名称，经纬度）

最新推荐文章于 2024-06-20 16:52:52 发布

匠心精神

最新推荐文章于 2024-06-20 16:52:52 发布

阅读量3.5k

点赞数

分类专栏：前端文章标签：百度地图当前位置 JavaScript 浏览器经纬度

本文链接：https://blog.csdn.net/qq_36623327/article/details/90764502

版权

前端专栏收录该内容

4 篇文章 1 订阅

订阅专栏

<!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="http://api.map.baidu.com/api?v=2.0&ak=你的AK"></script>
  <title>地图展示</title>
</head>
<body>
  <div id="allmap"></div>
</body>
</html>
<script type="text/javascript">
  // 百度地图API功能
  var map = new BMap.Map("allmap");    // 创建Map实例

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

  map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
  //添加地图类型控件
  map.setCurrentCity("北京");          

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


function getName(){
      var geoc = new BMap.Geocoder();
      geoc.getLocation(point, function(rs){
      var addComp = rs.addressComponents;
      console.log(addComp);
      alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber);
    });
}
</script>

匠心精神

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
百度地图 JavaScript 浏览器定位获取当前位置信息（名称，经纬度）

<!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" ...
复制链接

扫一扫