300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > 高德 百度地图获取省市区

高德 百度地图获取省市区

时间:2018-12-27 10:08:29

相关推荐

高德 百度地图获取省市区

近期,遇到一个根据定位获取省市区的需求,前期用了加载百度地图js的方式,经过实验,https在部分ios手机上都获取不到省市区。后来发现是百度地图API中getCurrentPosition方法提示错误。

现在的解决方案:先获取H5经纬度,获取到后调用高德地图接口的方式获取,如果失败,再去请求百度地图服务端api的方式。如果经纬度获取失败,则尝试加载高德地图js的方式。

把它封装起来:

getGeography() {if (navigator.geolocation) { //H5获取经纬度navigator.geolocation.getCurrentPosition(function(position) {var latitudes = position.coords.latitude; //获取纬度var longitudes = position.coords.longitude; //获取经度window.latitudes = position.coords.latitude; //获取纬度window.longitudes = position.coords.longitude; //获取经度getGaoDe(latitudes, longitudes) //获取到经纬度后,优先获取高德服务端api接口返回的省市县,如果失败,则用百度获取function getGaoDe(latitudes, longitudes) { //首先获取高德接口返回的省市区var loaction = longitudes + "," + latitudes;$jQuery.ajax({url: "/v3/geocode/regeo",type: "GET",cache: false,dataType: "jsonp",jsonp: "callback", //传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)jsonpCallback: "success",data: {key: "高德地图申请的ak",output: "json",coordtype: "wgs84ll",radius: "1000",location: loaction,extensions: "all",},dataType: "jsonp",success: function(res) {let data = res;if (data.status == 1) {let rest = data.regeocode;console.log('经度:' + longitudes, '纬度:' + latitudes, '省:' + rest.addressComponent.province, '市:' + Array.prototype.isPrototypeOf(rest.addressComponent.city) &&rest.addressComponent.city.length === 0 ?rest.addressComponent.province :rest.addressComponent.city, '区县:' + rest.addressComponent.district)//这里注意一下,文档上描述的是如果是直辖市,市返回的是空 } else {//失败则调用百度地图 getBaiDu(latitudes, longitudes)}}.bind(this),error: function(res) {getBaiDu(latitudes, longitudes)},});};function getBaiDu(latitudes, longitudes) { //百度获取gpsvar loaction = latitudes + ',' + longitudes$jQuery.ajax({url: "https://api./reverse_geocoding/v3/",type: "GET",cache: false,dataType: "jsonp",jsonp: "callback", //传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(默认为:callback)jsonpCallback: "success",data: {ak: "百度地图申请的ak",output: "json",coordtype: "wgs84ll",location: decodeURIComponent(loaction),},dataType: "jsonp",success: function(res) {let data = res;if (data.status == 0) {let res_data = data.result;console.log('经度:' + res_data.lng, '纬度:' + res_data.location.lat, '省:' + res_data.addressComponent.province, '市:' + res_data.addressComponent.city , '区县:' + res_data.addressComponent.district)} else {//失败}}.bind(this),error: function(res) {//失败},});}},function(error) {if (error.code == 1) {window.isError = '位置服务被拒绝'} else if (error.code == 2) {window.isError = '暂时获取不到位置信息'} else if (error.code == 3) {window.isError = '获取信息超时'} else if (error.code == 4) {window.isError = '未知错误'}//加载高德地图的时候一定要引入js<script type="text/javascript" src="/maps?v=1.4.0&key=你申请的key"></script><script type="text/javascript" src="/lbs/static/addToolbar.js"></script>这两段代码引入到html页面//经纬度获取失败,加载高德地图获取var map, geolocation;//加载地图,调用浏览器定位服务map = new AMap.Map("iCenter");map.plugin("AMap.Geolocation", function() {geolocation = new AMap.Geolocation({enableHighAccuracy: true, //是否使用高精度定位,默认:truetimeout: 1000, //超过10秒后停止定位,默认:无穷大maximumAge: 0, //定位结果缓存0毫秒,默认:0convert: true, //自动偏移坐标,偏移后的坐标为高德坐标,默认:trueshowButton: true, //显示定位按钮,默认:truebuttonPosition: "LB", //定位按钮停靠位置,默认:'LB',左下角buttonOffset: new AMap.Pixel(10, 20), //定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)showMarker: true, //定位成功后在定位到的位置显示点标记,默认:trueshowCircle: true, //定位成功后用圆圈表示定位精度范围,默认:truepanToLocation: true, //定位成功后将定位到的位置作为地图中心点,默认:truezoomToAccuracy: true, //定位成功后调整地图视野范围使定位位置及精度范围视野内可见,默认:false});map.addControl(geolocation);geolocation.getCurrentPosition();AMap.event.addListener(geolocation, "complete", onComplete); //返回定位信息AMap.event.addListener(geolocation, "error", onError); //返回定位出错信息});//解析定位结果function onComplete(data) {console.log('经度:' + data.position.lng, '纬度:' + data.position.lat, '省:' + data.addressComponent.province, '市:' + (typeof data.addressComponent.city == "undefined" || data.addressComponent.city == null || data.addressComponent.city == "") ?data.addressComponent.province :data.addressComponent.city, '区县:' + data.addressComponent.district)}//解析定位错误信息function onError(data) {}},// {////指示浏览器获取高精度的位置,默认false //enableHighAcuracy: true,////指定获取地理位置的超时时间,默认不限时,单位为毫秒 //// timeout: 5000,////最长有效期,在重复获取地理位置时,此参数指定多久再次获取位置 //maximumAge: 1000// });}},

因为只获取了省市区,没有精细到街道,没试过街道准确,自行参考

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。