百度地圖拖動選點並實時POI檢索附近興趣點
阿新 • • 發佈:2020-09-02
地圖拖拽選點使用了百度地圖的拖拽以及地址解析
data{ return{ goinit:'' } } var lng = sessionStorage.getItem('lng') var lat = sessionStorage.getItem('lat') //啟用滾輪縮放 var map= new BMap.Map("container"); var mPoint= new BMap.Point(lng, lat); var that = this var myGeo = new BMap.Geocoder(); //建立地址解析例項 var geolocation = new BMap.Geolocation(); map.centerAndZoom(mPoint,18); //初始化時,即可設定中心點和地圖縮放級別。 map.enableScrollWheelZoom(true); //開啟滾輪縮放 map.enableDragging() //開啟慣性拖拽 displayPOI(mPoint) // 檢索條件【檢索附近全部 var mOption = { poiRadius : 500, //半徑為1000米內的POI,預設100米 numPois : 12 //列舉出50個POI,預設10個 } // 初始化 this.goinit() // 返回初始位置操作 this.goinit = function () { map.panTo(mPoint); displayPOI(mPoint) } function displayPOI(point){ myGeo.getLocation(point,function mCallback(rs){ var allPois = rs.surroundingPois; //獲取全部POI console.log('displayPOI>>=',rs) //獲取結果 },mOption); } geolocation.getCurrentPosition(function(r){ if(this.getStatus() === BMAP_STATUS_SUCCESS){ //將地圖中心移動到可視區中點 map.panTo(r.point); map.addEventListener('dragend',function(){ //拖拽結束觸發 // 建立marker點,可以選擇新增或者刪除【小紅點標記】 var mk = new BMap.Marker(map.getCenter()); // map.addOverlay(mk); map.removeOverlay(mk); var pos = map.getCenter(); //map.getCenter();獲取當前地圖中心點座標 console.log(pos) displayPOI(pos) }); }else { alert('failed'+this.getStatus()); } });