javascript实现经纬度与地址的互转

提示：扫一扫查出行
【扫一扫了解最新限行尾号】
复制提示

最近项目中会用到将地址转换为经纬的。从出来，还一直未遇到过这类问题，下来自己提前学习了，将自己所学的记录在案。

在网上找了很多资料，最后确定了，百度的API，有实现相关的接口（API地址）。使用API时，需要申请一个ak，才能正常的进行访问。

上图是一个原理，即当我们传入对应的值时，返回对应的信息。这里我现在了返回json对象，对于XML操作有点复杂，在此省略。注：在用ajax调用时，dataType一定一定为JSONP，否则，你就慢慢找错吧（这也是花了我很多时间的地方，郁闷了很久）。这里为JSONP是因为这里跨域了。好了，下面就直接上代码了：

$(document).ready(function () {
/*
根据地址信息获取经纬度,返回json对象：
status Int 返回结果状态值，成功返回0。
location object 经纬度坐标
lat float 纬度值
lng float 经度值
precise Int 位置的附加信息，是否精确查找。1为精确查找，0为不精确。
confidence Int 可信度
level string 地址类型 {
status: 0,
result:
{
location:
{
lng: 116.30814954222,
lat: 40.056885091681
},
precise: 1,
confidence: 80,
level: "商务大厦"
}
}
*/
$('#search_address').click(function () {
var address = $.trim($('#address').val());
if (address != undefined && address != '') {
var url = 'http://api.map.baidu.com/geocoder/v2/?ak=eIxDStjzbtH0WtU50gqdXYCz&output=json&address=' + encodeURIComponent(address);
//根据地点名称获取经纬度信息
$.ajax({
type: "POST",
url: url,
dataType: "JSONP",
success: function (data) {
if (parseInt(data.status) == 0) {
$("#lng").html("经度：" + data.result.location.lng);
$("#lat").html("纬度：" + data.result.location.lat);
}
}
});
}
});
/*
根据经纬度获取详细地址及其周边信息，返回json对象：
status constant 返回结果状态值，成功返回0，其他值请查看附录。
location
lat 纬度坐标
lng 经度坐标
formatted_address 结构化地址信息
business 所在商圈信息，如 "人民大学,中关村,苏州街"
addressComponent city 城市名
district 区县名
province 省名
street 街道名
street_number 街道门牌号
pois（周边poi数组）
addr 地址信息
cp 数据来源
distance 离坐标点距离
name poi名称
poiType poi类型，如’ 办公大厦,商务大厦’
point poi坐标{x,y}
tel 电话
uid poi唯一标识
zip 邮编
*/
$('#search_lng_lat').click(function () {
var lng = $.trim($('#txtlng').val());
var lat = $.trim($('#txtlat').val());
var url = 'http://api.map.baidu.com/geocoder/v2/?ak=eIxDStjzbtH0WtU50gqdXYCz&output=json&pois=1&location=' + lat + "," + lng;
$.ajax({
type: "POST",
url: url,
dataType: "JSONP",
success: function (data) {
if (parseInt(data.status) == 0) {
var result = "地址：" + data.result.formatted_address + "</br>";
result += "省名:" + data.result.addressComponent.province + "</br>";
result += "城市名:" + data.result.addressComponent.city + "</br>";
result += "区县名:" + data.result.addressComponent.district + "</br>";
result += "街道名:" + data.result.addressComponent.street + "</br>";
result += "街道门牌号:" + data.result.addressComponent.street_number + "</br>";
result += "周边信息：</br>";
for (var i = 0; i < data.result.pois.length; i++) {
result += "地址信息:" + data.result.pois[i].addr
+ ",数据来源:" + data.result.pois[i].cp
+ ",离坐标点距离:" + data.result.pois[i].distance
+ ",poi名称:" + data.result.pois[i].name
+ ",poi类型:" + data.result.pois[i].poiType
+ ",poi坐标x:" + data.result.pois[i].point.x
+ ",poi坐标y:" + data.result.pois[i].point.y
+ ",电话:" + data.result.pois[i].tel
+ ",poi唯一标识:" + data.result.pois[i].uid
+ ",邮编:" + data.result.pois[i].zip + "</br>";
}
$('#spanadderss').html(result);
}
}
});
});
});