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

    首先附上百度地图的官方说明文档
    官方文档:
        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
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值