百度地图:根据名称定位地图&点击地图获取位置名称 |
您所在的位置：网站首页 › 百度地图显示收藏名称不对怎么设置 › 百度地图:根据名称定位地图&点击地图获取位置名称 |
百度地图:根据名称定位地图&点击地图获取位置名称
|
1.官网申请百度API密匙
此处Demo实现功能： 1.根据搜索框中的名称，定位地图。 2.用户点击地图时，显示该位置标注，并自动获取用户点击的位置与经纬度。 根据地址查询经纬度 要查询的地址： // getParentAddressName(); var map = new BMap.Map("container"); map.centerAndZoom("广州", 12); map.enableScrollWheelZoom(); //启用滚轮放大缩小，默认禁用 map.enableContinuousZoom(); //启用地图惯性拖拽，默认禁用 map.addControl(new BMap.NavigationControl()); //添加默认缩放平移控件 map.addControl(new BMap.OverviewMapControl()); //添加默认缩略地图控件 map.addControl(new BMap.OverviewMapControl({ isOpen: true, anchor: BMAP_ANCHOR_BOTTOM_RIGHT })); //右下角，打开 map.addEventListener("click",function(e){//点击地图获取经纬度 console.log(e.point) map.clearOverlays(); //清空原来的标注 var marker = new BMap.Marker(new BMap.Point(e.point.lng, e.point.lat)); // 创建标注，为要查询的地方对应的经纬度 map.addOverlay(marker); getAddress(e.point) }); var gc = new BMap.Geocoder(); function getAddress(point){ gc.getLocation(point,function(searchResult){ console.log(searchResult.address) document.getElementById("text_").value=searchResult.address; }) } var localSearch = new BMap.LocalSearch(map); localSearch.enableAutoViewport(); //允许自动调节窗体大小 function searchByStationName() { map.clearOverlays(); //清空原来的标注 var keyword = document.getElementById("text_").value; localSearch.setSearchCompleteCallback(function(searchResult) { var poi = searchResult.getPoi(0); map.centerAndZoom(poi.point, 13); var marker = new BMap.Marker(new BMap.Point(poi.point.lng, poi.point.lat)); // 创建标注，为要查询的地方对应的经纬度 map.addOverlay(marker); marker.addEventListener("click", function() { this.openInfoWindow(infoWindow); }); }); localSearch.search(keyword); } 4.效果1.可以根据搜索框中的名称获取地图 |
【本文地址】
今日新闻 |
推荐新闻 |