原文:【高德地图API】从零开始学高德JS API（八）——地址解析与逆地址解析

摘要：无论是百度LBS开放平台，还是高德LBS开放平台，其调用量最高的接口，必然是定位，其次就是地址解析了，又称为地理编码。地址解析，就是将地址转换为经纬度。而逆地址解析，就是将经纬度转换为地址。经纬度一般是由专业测绘机构用GPS采集，然后使用国测局接口加密，最后呈现在互联网地图上的。而地址，这里说的是结构化的带街道门牌号的地址，比如“北京市朝阳区阜通东大街6号”，这个地址是由公安局颁发的。而将地址和经纬度一一对应起来，这个就是高德地图做的事情了，也就是地址解析接口的功能了。地址解析功能，实用性强，调用频次高，谷歌API的地址解析接口甚至是收费的！所以，现在有现成免费的接口，大家应该很开心呀。

---------------------------------------------------------------------------

使用高德提供的AMap.Geocoder插件即可实现地址解析，和逆地址解析。

地理编码类是指将地址信息和地理坐标点信息进行相互转化，包括将地址信息转换为地理坐标点的编码和将地理坐标点转换为地址信息的逆地理编码。

1、地理编码

地理编码是将地址信息转换为地理坐标点信息，你可以使用此项功能在指定位置添加一个点或是定位地图上的某个位置。接口为：

geocoder.getLocation("北京市海淀区苏州街");

代码：

var geocoder;

//加载地理编码插件

mapObj.plugin(["AMap.Geocoder"],function(){

geocoder=new AMap.Geocoder({

radius:1000, //以已知坐标为中心点，radius为半径，返回范围内兴趣点和道路信息

city："010"//城市，默认："全国"

});

//返回地理编码结果

AMap . event . addListener(geocoder, "complete",geocoder_callBack);

geocoder.getLocation("北京市海淀区苏州街");

});

效果图：

2、逆地理编码

逆地理编码又称位置描述或地址解析，即从已知的经纬度坐标到对应的地址描述（如省市、街区、楼层、房间等）的转换。接口为：

geocoder.getAddress(lnglatXY);

代码：

var geocoder;

var lnglatXY=new AMap.LngLat(116.396574,39.992706);

//加载地理编码插件

mapObj.plugin(["AMap.Geocoder"],function(){

geocoder=new AMap.Geocoder({

radius:1000, //以已知坐标为中心点，radius为半径，返回范围内兴趣点和道路信息

extensions: "all"//返回地址描述以及附近兴趣点和道路信息，默认"base"

});

//返回地理编码结果

AMap . event . addListener(geocoder, "complete",geocoder_callBack);

//逆地理编码

geocoder.getAddress(lnglatXY);

});

效果图：

3、全部源代码

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>地址解析</title>

<link rel="stylesheet" type="text/css" href="zero.css" />

<script language="javascript" src="http://webapi.amap.com/maps?v=1.3&key=【您的key】"></script>

</head>

<body onLoad="mapInit()">

    <div id="iCenter"></div>

    <div id="iControlbox">

        <ul>

            <li>

                <input type="text" id="key_11" value="116.51413" />

                <input type="text" id="key_12" value="39.912896" />

                <button onclick="javascript:geocoder2();">逆地址解析</button>

            </li>

            <li>

                <input type="text" id="key_2" value="北京市朝阳区大屯路304号" />

                <button onclick="javascript:geocoder();">地址解析</button>

            </li>

        </ul>

    </div>

    <div id="result"></div>

</body>

<script language="javascript">

var mapObj;

var result;

var marker = [];

var windowsArr = [];

function mapInit () {

    mapObj = new AMap.Map('iCenter');    //默认定位：初始化加载地图时，center及level属性缺省，地图默认显示用户所在城市范围

};

var MGeocoder;

var key_11;

var key_12;

var key_2;

function geocoder2() {  //POI搜索，关键字查询

    key_11 = document.getElementById("key_11").value;

    key_12 = document.getElementById("key_12").value;

    var lnglatXY = new AMap.LngLat(key_11,key_12);

    //document.getElementById('result').innerHTML = "您输入的是：" + key_1;

    //加载地理编码插件

    mapObj.plugin(["AMap.Geocoder"], function() {

        MGeocoder = new AMap.Geocoder({

            radius: 1000,

            extensions: "all"

        });

        //返回地理编码结果

        AMap.event.addListener(MGeocoder, "complete", geocoder_CallBack2);

        //逆地理编码

        MGeocoder.getAddress(lnglatXY);

    });

    //加点

    var marker = new AMap.Marker({

        map:mapObj,

        icon: new AMap.Icon({

            image: "http://api.amap.com/Public/images/js/mark.png",

            size:new AMap.Size(58,30),

            imageOffset: new AMap.Pixel(-32, -0)

        }),

        position: lnglatXY,

        offset: new AMap.Pixel(-5,-30)

    });

    mapObj.setFitView();

}

//鼠标划过显示相应点

var marker2;

function onMouseOver (e) {

    var coor = e.split(','),

        lnglat = new AMap.LngLat(coor[0], coor[1]);

    if (!marker2) {

        marker2 = new AMap.Marker({

            map:mapObj,

            icon: "http://webapi.amap.com/images/0.png",

            position: lnglat,

            offset: new AMap.Pixel(-10, -34)

        });

    } else {

        marker2.setPosition(lnglat);

    }

    mapObj.setFitView();

}

function geocoder_CallBack2(data) { //回调函数

    var resultStr = "";

    var roadinfo ="";

    var poiinfo="";

    var address;

    //返回地址描述

    address = data.regeocode.formattedAddress;

    //返回周边道路信息

    roadinfo +="<table style='width:600px'>";

    for(var i=0;i<data.regeocode.roads.length;i++){

        var color = (i % 2 === 0 ? '#fff' : '#eee');

        roadinfo += "<tr style='background-color:" + color + "; margin:0; padding:0;'><td>道路：" + data.regeocode.roads[i].name + "</td><td>方向：" + data.regeocode.roads[i].direction + "</td><td>距离：" + data.regeocode.roads[i].distance + "米</td></tr>";

    }

    roadinfo +="</table>"

    //返回周边兴趣点信息

    poiinfo += "<table style='width:600px;cursor:pointer;'>";

    for(var j=0;j<data.regeocode.pois.length;j++){

        var color = j % 2 === 0 ? '#fff' : '#eee';

        poiinfo += "<tr onmouseover='onMouseOver(\"" + data.regeocode.pois[j].location.toString() + "\")' style='background-color:" + color + "; margin:0; padding:0;'><td>兴趣点：" + data.regeocode.pois[j].name + "</td><td>类型：" + data.regeocode.pois[j].type + "</td><td>距离：" + data.regeocode.pois[j].distance + "米</td></tr>";

    }

    poiinfo += "</table>";

    //返回结果拼接输出

    resultStr = "<div style=\"font-size: 12px;padding:0px 0 4px 2px; border-bottom:1px solid #C1FFC1;\">"+"<b>地址</b>："+ address + "<hr/><b>周边道路信息</b>：<br/>" + roadinfo + "<hr/><b>周边兴趣点信息</b>：<br/>" + poiinfo +"</div>";

    document.getElementById("result").innerHTML = resultStr;

} 

function geocoder() {  //地理编码返回结果展示

    key_2 = document.getElementById("key_2").value;

    mapObj.plugin(["AMap.Geocoder"], function() {     //加载地理编码插件

        MGeocoder = new AMap.Geocoder();

        //返回地理编码结果

        AMap.event.addListener(MGeocoder, "complete", geocoder_CallBack);

        MGeocoder.getLocation(key_2);  //地理编码

    });

}

//地理编码返回结果展示

function geocoder_CallBack(data){

    var resultStr="";

    //地理编码结果数组

    var geocode = new Array();

    geocode = data.geocodes;

    for (var i = 0; i < geocode.length; i++) {

        //拼接输出html

        resultStr += "<span style=\"font-size: 12px;padding:0px 0 4px 2px; border-bottom:1px solid #C1FFC1;\">"+"<b>地址</b>："+geocode[i].formattedAddress+""+ "<b>    坐标</b>：" + geocode[i].location.getLng() +", "+ geocode[i].location.getLat() +""+ "<b>    匹配级别</b>：" + geocode[i].level +"</span>";

        addmarker(i, geocode[i]);

    }

    mapObj.setFitView();

    document.getElementById("result").innerHTML = resultStr;

}

function addmarker(i, d) {

    var lngX = d.location.getLng();

    var latY = d.location.getLat();

    var markerOption = {

        map:mapObj,

        icon:"http://webapi.amap.com/images/"+(i+1)+".png",

        position:new AMap.LngLat(lngX, latY)

    };

    var mar = new AMap.Marker(markerOption);

    marker.push(new AMap.LngLat(lngX, latY));

    var infoWindow = new AMap.InfoWindow({

        content:d.formattedAddress,

        autoMove:true,

        size:new AMap.Size(150,0),

        offset:{x:0,y:-30}

    });

    windowsArr.push(infoWindow); 

    var aa = function(e){infoWindow.open(mapObj,mar.getPosition());};

    AMap.event.addListener(mar,"click",aa);

}

</script>

</html>

demo地址：http://zhaoziang.com/amap/zero_8_1.html

【高德地图API】从零开始学高德JS API（八）——地址解析与逆地址解析的更多相关文章

  1. 【高德地图API】从零开始学高德JS API（七）——定位方式大揭秘

    原文:[高德地图API]从零开始学高德JS API(七)——定位方式大揭秘 摘要:关于定位,分为GPS定位和网络定位2种.GPS定位,精度较高,可达到10米,但室内不可用,且超级费电.网络定位,分为w ...

  2. 【高德地图API】从零开始学高德JS API（六）——坐标转换

    原文:[高德地图API]从零开始学高德JS API(六)——坐标转换 摘要:如何从GPS转到谷歌?如何从百度转到高德?这些都是小case.我们还提供,如何将基站cell_id转换为GPS坐标? --- ...

  3. 【高德地图API】从零开始学高德JS API（五）路线规划——驾车|公交|步行

    原文:[高德地图API]从零开始学高德JS API(五)路线规划——驾车|公交|步行 先来看两个问题:路线规划与导航有什么区别?步行导航与驾车导航有什么区别? 回答: 1.路线规划,指的是为用户提供3 ...

  4. 【高德地图API】从零开始学高德JS API（四）搜索服务——POI搜索|自动完成|输入提示|行政区域|交叉路口|自有数据检索

    原文:[高德地图API]从零开始学高德JS API(四)搜索服务——POI搜索|自动完成|输入提示|行政区域|交叉路口|自有数据检索 摘要:地图服务,大家能想到哪些?POI搜素,输入提示,地址解析,公 ...

  5. 【高德地图API】从零开始学高德JS API（三）覆盖物——标注|折线|多边形|信息窗口|聚合marker|麻点图|图片覆盖物

    原文:[高德地图API]从零开始学高德JS API(三)覆盖物——标注|折线|多边形|信息窗口|聚合marker|麻点图|图片覆盖物 摘要:覆盖物,是一张地图的灵魂.有覆盖物的地图,才是完整的地图.在 ...

  6. 【高德地图API】从零开始学高德JS API（二）地图控件与插件——测距、圆形编辑器、鼠标工具、地图类型切换、鹰眼鱼骨

    原文:[高德地图API]从零开始学高德JS API(二)地图控件与插件——测距.圆形编辑器.鼠标工具.地图类型切换.鹰眼鱼骨 摘要:无论是控件还是插件,都是在一级API接口的基础上,进行二次开发,封装 ...

  7. 【高德地图API】从零开始学高德JS API（一）地图展现——仙剑地图，麻点图，街景，室内图

    原文:[高德地图API]从零开始学高德JS API(一)地图展现——仙剑地图,麻点图,街景,室内图 摘要:关于地图的显示,我想大家最关心的就是麻点图,自定义底图的解决方案了吧.在过去,marker大于 ...

  8. 从零开始学习Node.js例子八 使用SQLite3和MongoDB

    setup.js:初始化数据库 var util = require('util'); var async = require('async'); //npm install async var no ...

  9. 从零开始学ios开发（八）：Autorotation and Autosizing

    不好意思,这一篇间隔的时间有点长,最近实在是事情太多,耽搁了,好了,长话短说,下面继续学习ios. 这次学习的内容是Autorotation和Autosizing,Autorotation就是屏幕内容 ...

随机推荐

  1. URAL 1553. Caves and Tunnels 树链拆分

    一颗树 每次出发点右键值是0 2操作模式1.第一i右键点值添加x 2.乞讨u至v在这条路上右上方值 树为主的连锁分裂称号 #include <cstdio> #include <cs ...

  2. CodeForces 484A Bits

    意甲冠军: 10000询价  每次查询输入L和R(10^18)  在区间的二进制输出指示1大多数数字  1个数同样输出最小的 思路: YY一下  认为后几位全是1的时候能保证1的个数多  那么怎样构造 ...

  3. 使用WSE实现Web Service安全----我的第一篇

    原文:使用WSE实现Web Service安全----我的第一篇 WSE(Web Services Enhancements)是微软为了使开发者通过.NET创建出更强大,更好用的Web Service ...

  4. 未能加载文件或程序集“Common”或它的某一个依赖项。试图加载格式不正确的程序

    原因:操作系统是64位的,但发布的程序引用了一些32位的ddl,所以出现了兼容性的问题解决方案一:如果是64位机器,IIS——应用程序池——高级设置——启用32位应用程序 :true.解决方案二:修改 ...

  5. 深入研究Java类载入机制

    深入研究Java类载入机制   类载入是Java程序运行的第一步,研究类的载入有助于了解JVM运行过程,并指导开发人员採取更有效的措施配合程序运行. 研究类载入机制的第二个目的是让程序能动态的控制类载 ...

  6. hdu4185 Oil Skimming（偶匹配）

    <span style="font-family: Arial; font-size: 14.3999996185303px; line-height: 26px;"> ...

  7. 第三章——使用系统函数、存储过程和DBCC SQLPERF命令来监控SQLServer（3）

    原文:第三章--使用系统函数.存储过程和DBCC SQLPERF命令来监控SQLServer(3) 本文为这个系列最后一篇.将是如何使用DBCC命令来监控SQLServer日志空间的使用情况. 前言: ...

  8. 移动端 常见布局CSS3的细节

    结合 Framework7 和ios UI系统,微信weUI,支付宝H5    我们在移动端一些css用法 细节的有了更深的了解: 高斯模糊的显示效果,ios8以上支持,ios8以上0.5px,bac ...

  9. NET 中的多线程

    NET 中的多线程 为什么使用多线程 使用户界面能够随时相应用户输入 当某个应用程序在进行大量运算时候,为了保证应用程序能够随时相应客户的输入,这个时候我们往往需要让大量运算和相应用户输入这两个行为在 ...

  10. Java Web项目结构

    Java Web项目结构(一般) 1.Java src 2.JRE System Library 3.Java EE 6 Libraries 4.Web App Libraries 5.WebRoot ...