JavaScript--百度地图定位，可拖拽

最新推荐文章于 2022-11-13 23:55:53 发布

weixin_34221112

最新推荐文章于 2022-11-13 23:55:53 发布

阅读量439

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/hs610/p/9625503.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=c4gzpT5Nq6kzMLxK9xYLduaILi4jlt1Q"></script>
    <title>JavaScript百度地图接口定位</title>
    <style>
        .BMap_cpyCtrl {
            display: none;
        }
        .anchorBL {
            display: none;
        }
    </style>
</head>
<body>
<div id="allmap"></div>
<script type="text/javascript">

    //定位成功事件
    var myKeys='';      // 当前定位为位置
    var myKeys2='';     // 拖动后的位置
    var lng='';         // 经度
    var lat='';         // 纬度
    // 百度地图API功能
    var map = new BMap.Map("allmap");
    var point = new BMap.Point(116.331398,39.897445);
    map.centerAndZoom(point,17);

    //添加上缩放的平移控件，缩略图控件以及设置显示的位置-->
    map.addControl(new BMap.NavigationControl());
    var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(function(r){
        console.log(r.point);
        if(this.getStatus() == BMAP_STATUS_SUCCESS){
            var mk = new BMap.Marker(r.point);
            map.addOverlay(mk);//标出所在地
            map.panTo(r.point);//地图中心移动
            lng=r.point.lng;
            lat=r.point.lat;
            var point = new BMap.Point(r.point.lng,r.point.lat); //用所定位的经纬度查找所在地省市街道等信息
            var gc = new BMap.Geocoder();
            var gc2 = new BMap.Geocoder();
            gc.getLocation(point, function(rs){
                var addComp = rs.addressComponents;
                console.log(rs.address);//地址信息
                myKeys = rs.address;
                alert(myKeys);         //弹出所在地址
            });
                var marker = new BMap.Marker(point); //创建标注
                map.addOverlay(marker);              //将标注添加到地图中
                marker.enableDragging();             //设置标注可拖拽(默认为不可拖拽)
                marker.addEventListener('dragend', function(e){
                    var point2 = new BMap.Point(e.point.lng,e.point.lat); //用所定位的经纬度查找所在地省市街道等信息
                    // alert('当前坐标：' + e.point.lng + ", " + e.point.lat);
                    gc.getLocation(point2, function(rs2){
                        var addComp = rs2.addressComponents;
                        console.log(rs2.address);//地址信息
                        myKeys2 = rs2.address;
                        alert(myKeys2);  //弹出所在地址
                    });
                });


        }else {
            alert('failed'+this.getStatus());
        }
    },{enableHighAccuracy: true});
</script>
</body>
</html>

转载于:https://www.cnblogs.com/hs610/p/9625503.html

weixin_34221112

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript--百度地图定位，可拖拽

<html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> &...
复制链接

扫一扫