layer彈出百度地圖,選取經緯度至文本框中


關鍵在於open后再調用百度的方法

<div id="maplocation" style="width:500px;height:500px;display: none;"></div>
    經度<input type="text" id="lng">
    緯度<input type="text" id="lat">
    <button id="dian">點擊我</button>

 

   $(function(){
layui.use('layer', function(){
  var layer = layui.layer;
  })
            $("#dian").click(function(){
                 layer.open({
                     type:1,
                     area:"500px",
                     title:"測試",
                     content:$('#maplocation'),
                     success:function(){
                         var map = new BMap.Map("maplocation"); // 創建地圖實例 
                        map.enableScrollWheelZoom();   //啟用滾輪放大縮小,默認禁用
                        var point = new BMap.Point(116.404, 39.915); // 創建點坐標 
                        map.centerAndZoom(point, 12);
                        function myFun(result){
                            var cityName = result.name;
                            map.setCenter(cityName);
                            //alert("當前定位城市:"+cityName);
                        }
                        var myCity = new BMap.LocalCity();
                        myCity.get(myFun);
                        var marker = new BMap.Marker(map.getCenter());  // 創建標注
                        map.addOverlay(marker);               // 將標注添加到地圖中
                        marker.enableDragging();                //可拖拽
                        //marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳動的動畫
                        map.addEventListener("click",function(e){  
                             // alert(e.point.lng+","+e.point.lat);// 單擊地圖獲取坐標點;
                             //$(‘#lng‘).val(e.point.lng);
                             //$(‘#lat‘).val(e.point.lat);
                             //map.panTo(new BMap.Point(e.point.lng,e.point.lat));// map.panTo方法,把點擊的點設置為地圖中心點  
                        }); 
                        marker.addEventListener("dragend", function(e){                    //拖拽標注獲取標注坐標
                             //alert("當前位置:" + e.point.lng + ", " + e.point.lat);           //可拖拽的標注 
                             $("#lng").val(e.point.lng);
                            $("#lat").val(e.point.lat);
                        })
                        //加載完成之后,改變標注點坐標,使之和當前定位的城市基本相符
                        map.addEventListener("tilesloaded",function(){
                            var newpoint = map.getCenter();
                            marker.setPosition(newpoint);
                        });
                     },
                     cancel:function(){
                     }
                 });
            });
        

 

})

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM