百度地图拖拽获取地址实例
小白 2022-08-31 【原创文章】
百度地图拖拽获取地址实例
引入百度
<script type="text/javascript" src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=XXXXX"></script>
//地址解析 创建点 var myGeo = new BMapGL.Geocoder(); function geoCode(){ map.clearOverlays(); var address = $("#address").val() myGeo.getPoint(address, function(point){ if(point){ map.centerAndZoom(point, 16); // map.addOverlay(new BMapGL.Marker(point, {title: '北京市海淀区上地10街'})) var mk = new BMapGL.Marker(point); mk.enableDragging(); map.addOverlay(mk) mk.addEventListener("dragend", function(e){ var x = e.latLng.lng; //经度 var y = e.latLng.lat; //纬度 $("[name='lat']").val(y) $("[name='lng']").val(x) // 根据坐标得到地址描述 myGeo.getLocation(new BMapGL.Point(x,y), function(result){ if (result){ $("[name='address']").val(result.address) } }); console.log("拖到的地点的经纬度:" + x + "," + y); }); }else{ alert('您选择的地址没有解析到结果!'); } }) } 自动获取当前位置 var map = new BMapGL.Map('container'); var zoomCtrl = new BMapGL.ZoomControl(); map.addControl(zoomCtrl); //获取当前定位 var geolocation = new BMapGL.Geolocation(); geolocation.getCurrentPosition(function(r){ if(this.getStatus() == BMAP_STATUS_SUCCESS){ var mk = new BMapGL.Marker(r.point); // console.log('point',r.point) mk.enableDragging(); map.addOverlay(mk); mk.addEventListener("dragend", function(e){ var x = e.latLng.lng; //经度 var y = e.latLng.lat; //纬度 $("[name='lat']").val(y) $("[name='lng']").val(x) // 根据坐标得到地址描述 myGeo.getLocation(new BMapGL.Point(x,y), function(result){ if (result){ $("[name='address']").val(result.address) } }); console.log("拖到的地点的经纬度:" + x + "," + y); }); map.panTo(r.point); map.centerAndZoom(new BMapGL.Point(r.point.lng,r.point.lat), 12); }else { map.centerAndZoom(new BMapGL.Point(116.331398,39.897445), 12); } });
最新发布
- 守护进程-kill端口-输出日志-查看等!
- git 本地分支关联远程分支,合并!
- pytorch安装(含cuda、cudnn安装教程)!
- linux系统下ubuntu22.04安装Docker方法!
- 视频截取封面 =php-ffmpeg/php-ffmpeg!
- 常用实例2023-5-10!
- 富文本 塞入mysql 报错: General error: 1366 Incorrect string value: ‘\xF0\x9F\x98\x84‘ for column ‘content‘!
- 百度地图拖拽获取地址实例!
- php使用smtp鉴权方式发送邮件 插件PHPMailer!
- 有道翻译接口对接!