顯示地址小圖,點擊跳轉百度地圖

    首先附上百度地圖的官方說明文檔
    官方文檔:
        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();清除地圖覆蓋物。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章