JS使用百度地图应用程序接口自动获取地址和经纬度操作示例

本文实例讲述了射流研究…使用百度地图应用程序接口自动获取地址和经纬度操作。分享给大家供大家参考，具体如下：

在实际工作中我们经常会遇到这样的问题，但是当我们去看百度应用程序接口的时候往往又达不到我们的要求。

故此，本篇博文讲述如何使用百度地图应用程序接口自动获取地址和经纬度：

1、超文本标记语言代码如下

！DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML 1/DTD/XHTML 1-Transitional。DTD ' html xmlns=' http://www .w3。org/1999/XHTML '标题点击地图获取地址和经纬度地图、地址lng、lat/title meta name=' robots ' Content='无索引，无跟随' meta http-equiv=' Content-Type ' Content=' text/html；charset=utf-8'/！-将百度地图应用程序接口引入，设置好自己的key-script类型=' text/JavaScript ' src=' http :http://API。地图。百度。com/API？v=2.0ak=7a 6 qkailzftimkmgaflg7qt 1 glfincg '/script/headdydiv class=' main-div ' form method=' post ' action=' name=' FORrm ' enctype=' multipart/form-data ' on submit=' return validate()' table单元格间距=' 1 '单元格填充=' 3 ' width=' 100% ' tr TD class=' label '经度/TD TD TD输入类型=' text '名称=' LNG ' id=' LNG ' value=' '//TD/tr TD class=' label '纬度/TD TD TD input type=' text ' name=' lat ' id=' lat ' value=' '//TD/tr TD class=' label '地址TD TD TD输入类型=“文本”值=' name=' sever _ add ' id=' sever _ add '只读输入类型='按钮'值='点击显示地图获取地址经纬度id=' open '/TD/tr/table/form div id=' all map ' style=' width : 50%； 高度： 50%;绝对位置：显示：无'/div/div/body/html 2、JS代码如下

脚本类型='text/javascript '函数validate(){ var sever _ add=document。getelementsbyname(' sever _ add ')[0].价值；if (isNull(sever_add)) { alert('请选择地址');返回false}返回true} //判断是否是空函数isNull(a){ return(a==' ' | |类型为(a)=' undefined ' | | a==null)？真：假；} document.getElementById('open ').onclick=function(){ if(document。getelementbyid(' all map ')。风格。display==' none '){文档。getelementbyid(' all map ')。风格。display=' block} else { document。getelementbyid(' all map ')。风格。显示='无'；} } var映射=新的BMap .地图('所有地图')；var geoc=新的BMap .geocoder()；//地址解析对象var标记数组=[]；定义变量地理位置=新的BMap .地理位置();定义变量点=新的BMap .点(116.331398,39.897445);地图中心和缩放（点，12);//中心点geolocation.getCurrentPosition(函数{如果(这个。getstatus()==BMAP _ STATUS _ SUCCESS){ var MK=新BMAP .标记(r .点)；地图。AddVerlay(MK)；地图。(r .点)；map.enableScrollWheelZoom(真);} else { alert('失败'此。GetStatus())；} }，{ enablehighapprecycy : true })映射。addeventlistener(' click '，ShowInfo)；//清除标识函数清除覆盖(){ if(标记数组){ for(标记数组中的I){ map。removeoverlay(标记数组[I])} } }//地图上标注函数addMarker(点){ var marker=新BMap .标记（点);markersArray.push(标记);clear Laops()；map.addOverlay(标记);} //点击地图时间处理函数showInfo(e){文档。getelementbyid(' LNG ').值=e点。液化天然气；document.getElementById('lat ').值=e点。稍后；geoc.getLocation(e.point，function(RS){ var addComp=RS。地址组件；var地址=addComp。省份添加组件。城市添加组件。地区添加组件。街道addComp.streetNumber如果（确认('确定要地址是地址？)){文档。getelementbyid(' all map ')。风格。显示='无'；文件。getelementbyid(' sever _ add ').值=地址；} });添加标记(即点)；}/脚本将射流研究…代码放入到超文本标记语言中，我们可以得到效果图如下：

更多关于Java脚本语言相关内容还可查看本站专题： 《JavaScript数学运算用法总结》 、 《JavaScript数据结构与算法技巧总结》 、 《JavaScript数组操作技巧总结》 、 《JavaScript事件相关操作与技巧大全》 、 《JavaScript操作DOM技巧总结》 及《JavaScript字符与字符串操作技巧总结》

希望本文所述对大家Java脚本语言程序设计有所帮助。