显示地址小图，点击跳转百度地图

来源：互联网发布：淘宝推广拉人进群编辑：程序博客网时间：2024/05/18 03:56

    首先附上百度地图的官方说明文档
    官方文档:
        http://developer.baidu.com/map/wiki/index.php?title=uri/api/web
    获取功能参考地址：
        http://www.tuicool.com/articles/BVzI73
    地图详细API接口：
        http://developer.baidu.com/map/jsdemo.htm#a1_2

简要说明下这个功能的实现要点：

<a href="http://api.map.baidu.com/geocoder?address=地址&amp;output=html" target="_blank"><img type="location" style="width:250px; height:250px;" src="http://api.map.baidu.com/staticimage?&#10;&#9;&#9;&#9;&#9;width=250&amp;height=250&amp;zoom=16&amp;center=地址"></a>

以上就是展示小图，点击跳转百度地图功能的主要代码，address=要定位的地址，output=html是必须的，否则无法打开。zoom=16是指定地图的显示级别，级别可设定3-18中的任意数值，数值越大地图放大级数越大。

实际使用用例：

(function(global){     var mapPage;     mapPage = global.mapPage = {};     mapPage = {          map:null,          gc:null     }})(this);

先设置全局变量，在地图的使用中多数地方使用到了全局变量。mapPage.map = new BMap.Map(“container”);，在指定的容器内创建地图实例。mapPage.gc = new BMap.Geocoder();，新建一个地址解析类

mapPage.gc.getLocation(e.point, function(rs){     showLocationInfo(e.point, rs);});

其中e.point为位置的经纬度信息，rs为地点的详细位置信息，可以使用mapPage.map.clearOverlays();清除地图覆盖物。

1 0