1. 程式人生 > >百度地圖 Javascript API 遍歷搜尋結果

百度地圖 Javascript API 遍歷搜尋結果

API文件:http://developer.baidu.com/map/jshome.htm

但說明不夠詳細,這裡給出一個遍歷搜尋結果的完整例項。

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>

(1) 這裡需要引用百度地圖的API,官方文件

    <title>百度地圖</title>
</head>
<body style="overflow: scroll">
        <div id="allmap" style="height: 100px"></div>
(2)定義儲存地圖的頁面元素
</body>
</html>
<script type="text/javascript">
    var map = new BMap.Map("allmap");             
    var point = new BMap.Point(116.404, 39.915);     
    map.centerAndZoom(point, 12);                      
    map.enableScrollWheelZoom();                            
</script>

(3) 建立地圖物件,並進行初始化,初始化是必要的,否則不能進行任何操作。


<script type="text/javascript">
    var ls = new BMap.LocalSearch(map);
    // 定義每一頁結果載入完成的回撥函式
    function onSearchComplete(result) {
        var n = result.getNumPois();
        var tab = document.getElementById("courtList");
        var msg = document.getElementById("errMsg");
        var i = 0;

        for (i = 0; i < result.getCurrentNumPois() ; i++) {
            var tr = tab.insertRow(tab.rows.length);
            var poi = result.getPoi(i);

            tr.insertCell(0).innerText = i + ls.getPageCapacity() * result.getPageIndex();
            tr.insertCell(1).innerText = poi.title;
            tr.insertCell(2).innerText = poi.point.lng;
            tr.insertCell(3).innerText = poi.point.lat;
            tr.insertCell(4).innerText = poi.phoneNumber;
            tr.insertCell(5).innerText = poi.address;
            tr.insertCell(6).innerText = poi.tags;
        }
        // 判斷是否到最後一頁,如果是則不再搜尋
        if (result.getPageIndex() < result.getNumPages() - 1)
            ls.gotoPage(result.getPageIndex() + 1);
    }

    ls.setSearchCompleteCallback(onSearchComplete);
    ls.setPageCapacity(100);
    ls.search("關鍵詞");
</script>
(4) 定義搜尋。呼叫LocalSearch.search方法後只給出第一頁的結果,如果要進行後續的查詢必須 使用 LocalSearch.gotoPage再次獲取,每頁結果載入完成都會呼叫回撥函式