百度地圖 Javascript API 遍歷搜尋結果
阿新 • • 發佈:2018-12-24
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,官方文件
(2)定義儲存地圖的頁面元素<title>百度地圖</title> </head> <body style="overflow: scroll"> <div id="allmap" style="height: 100px"></div>
</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) 建立地圖物件,並進行初始化,初始化是必要的,否則不能進行任何操作。
(4) 定義搜尋。呼叫LocalSearch.search方法後只給出第一頁的結果,如果要進行後續的查詢必須 使用 LocalSearch.gotoPage再次獲取,每頁結果載入完成都會呼叫回撥函式<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>