原文:【高德地图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. 源代码版本控制工具TortoiseSVN，AnkhSVN最新版本下载地址

    TortoiseSVN http://tortoisesvn.net/downloads.html 页面下部有中文语言补丁 AnkhSVN https://ankhsvn.open.collab.ne ...

  2. hdu 1150 Machine Schedule(最小顶点覆盖)

    pid=1150">Machine Schedule Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/327 ...

  3. Unity3D 表对象分类中的实现（C#）

    // Sort by distance in descending order private void SortTargetsByDistance () { targets.Sort(delegat ...

  4. Guest与virtio netdev交互模式

    Qemu为virtio设备分配了专门的pci设备ID,device IDs (vendor ID 0x1AF4) from 0x1000 through 0x10FF,而pci子系统中的厂商ID和设备 ...

  5. zoj 2156 - Charlie&#39;s Change

    称号:拼布钱,表面值至1,5.10.25.寻求组成n表面值硬币的最大数目. 分析:dp,01背包.需要二元分割,除此以外TLE.使用每个硬币的数组记录数.轻松升级. 写了一个 多重背包的 O(NV)反 ...

  6. Apache 2.4虚拟主机配置

    托管它指的是多个站点的执行一台机器上 (例如 company1.example.com 和 company2.example.com) . 机能够"基于 IP",即每一个 IP 一 ...

  7. 原生js判断css3动画过度(transition)结束 transitionend事件 以及关键帧keyframes动画结束(animation)回调函数 animationEnd 以及 css 过渡 transition无效

      上图的 demo 主要讲的 是 css transition的过渡回调函数transitionend事件: css3 的时代,css3--动画 一切皆有可能: 传统的js 可以通过回调函数判断动画 ...

  8. Mybatis之ResultMap一个简短的引论，关联对象

    基础部分能够查看我的还有一篇博客http://blog.csdn.net/elim168/article/details/40622491 MyBatis中在查询进行select映射的时候.返回类型能 ...

  9. dojo在错误隐藏表行

    1.错误叙述性说明 TypeError:role._by_idx[e.rowIndex].hide is not a function           (54 out of range 3) 2. ...

  10. oracle 解锁scott账户

    安装oracle数据库的时候忘了解锁账户,再加上一直配置不成功,链接不上,最后终于配置好了,发现没账户可用,oracle好难. oracle版本是 Oracle Database 11g Enterp ...