根据经纬度获取城市信息,该方法一般用于web端定位使用。楼主用的谷歌地图api

 狼丶宇先生   2017-09-02 09:46   605 人阅读  0 条评论

首先推荐一个网址,在这个网址里可以根据当前的经纬度信息查询城市的信息。

访问这个地址:

http://maps.google.cn/maps/api/geocode/json?latlng=32.7763644055,100.4338731743&language=EN
就能看到大概
参数:
latlng 经纬度浮点数
language 返回的语言,EN是英文,CN是中文
想要进一步试验的话,浏览器打开网址:
http://www.gpsspg.com/maps.htm
这是一个经纬度查询的网站,在打开的地图上找你想要实验的地点鼠标双击,会出现类似:
谷歌地图:31.7167557609,110.6993577756
百度地图:31.7224490000,110.7059870000
腾讯高德:31.7167569799,110.6993742387
图吧地图:31.7181258899,110.6976932987
谷歌地球:31.7188958899,110.6942132987
北纬N31°43′8.03″ 东经E110°41′39.17″
这样的提示框,选择谷歌地图字样的那一栏的数字复制下来,作为latlng参数的值访问此篇开头的url,就可以查看结果
现在可以使用你熟悉的语言针对这个api进行封装了


下面是代码方法,仅供参考和学习:

/**
 * 获取用户当前位置
 */
function geoFindMe() {
		//浏览器判断 是否支持 H5 geolocation
    if (navigator.geolocation){
        navigator.geolocation.getCurrentPosition(showPosition);
    }else{
    	alert('Geolocation is not supported by this browser.');
    }
    	//坐标查询
    function showPosition(position){
    	var	latitude = position.coords.latitude;//经度
    	var	longitude = position.coords.longitude; //维度
    	var getCityList = geiLatlng(longitude,latitude);//调用查询  获取城市列表
    		console.log(getCityList);
    }
}
geoFindMe(); //初始化调用

/**
 * 根据坐标查询城市
 * @param longitude 经度
 * @param latitude 纬度
 * result data[]
 * */
function geiLatlng(longitude,latitude){
	if(longitude !=null && latitude !=null && longitude !=undefined && latitude !=undefined){
		var  cityLsit = [];//城市列表
		var  language = 'CN'; //默认中文
    	if(window.localStorage){
    		if(window.localStorage.languages != null && window.localStorage.languages != undefined){
    			language = window.localStorage.languages.value == 'zh-en' ? 'EN' : 'CN'; //用户是否有自定义的语言
    		}
    	}
    	//根据坐标查询当前城市
    	$.ajax({
    		type:"get",
    		url:"http://maps.google.cn/maps/api/geocode/json?latlng="+latitude+","+longitude+"&language="+language, //谷歌查询接口
    		async:true,
    		data:null,
    		success:function(res){
    			if(res !=null && res.status=='OK'){
    				var data = res.results;
    				var temp = [];
    				for (x in data) {
    					if(data[x].address_components != undefined){
    						for(y in data[x].address_components){
    							if(data[x].address_components[y].types[0] == 'locality'){
    								temp.push(data[x].address_components[y].long_name);
    							}
    						}    		
    					}    						    					
    				}
    				//数组去重
				    	if(cityLsit.length > 0){
							for (var i = 0; i < cityLsit.length; i++) {
					          	if (cityLsit.indexOf(cityLsit[i]) != i) {
					             	cityLsit.splice(i,1);//删除数组元素后数组长度减1后面的元素前移
					              	i--;//数组下标回退
					          	}
				     		}
				    	}			    				
    			}
    		},
    		error:function(res){
    			alert('Position Error!');
    		}
    	});	
		return cityLsit;
	}
}

blob.png

blob.png

此文章仅做参考和学习。

本文地址:http://hao2013.cn/?id=33
版权声明:本文为原创文章,版权归 狼丶宇先生 所有,欢迎分享本文,转载请保留出处!