摘要:地圖服務,大家能想到哪些?POI搜素,輸入提示,位址解析,公交導航,駕車導航,步行導航,道路查詢(交叉口),行政區劃等等。如果說覆寫物Marker是地圖的骨骼,那麼服務,就是地圖的氣血。有個各種各樣的地圖服務,我們的地圖應用才能變得有血有肉,活靈活現。第四篇拆成了幾個要點,本篇主要講搜尋服務。包括周邊搜尋,關鍵詞搜尋,範圍搜尋,搜尋提示(自動完成,輸入提示),行政區域,交叉路口,檢索自有資料(雲圖)。
demo:
示意圖1:自動完成,輸入提示
示意圖2:雲圖,自有資料檢索,A-H圖示顯示,麻點圖
---------------------------------------------------------------------------------------
一、POI搜尋
1、關鍵字查詢
使用search方法,傳一個關鍵詞參數即可。
完整代碼:
示意圖:
2、輸入提示
html部分:
JS部分:
在地圖初始化時,添加【自動完成/輸入提示】插件。
輸入提示部分:
3、周邊查詢
使用searchNearBy方法,需要傳入關鍵詞,中心點經緯度,搜尋半徑。
全部代碼:
4、可視區域查詢 5、範圍内查詢
範圍内查詢,可以是多邊形,可以是圓形,也可以是矩形。
我們在這裡,用一個矩形搜尋來舉例。
使用searchInBounds方法,傳入關鍵詞,與範圍即可。
可視區域,就是視野内查詢,這時可以擷取整個可視區域,把這個區域傳給範圍内搜尋即可。
6、道路查詢(交叉口)
如果要查詢北京的101國道,需要傳參數‘101’和‘北京’。
7、自有資料檢索(不需要資料庫)
檢索自有資料,是我的最愛。其實就是使用雲圖就好了。
登入雲圖管理台:
建立地圖
批量導入自有資料,或者手工添加自有資料。
點選預覽,即可獲得自己的地圖!比如這樣的:
顯示雲圖層,需要獲得自己的tableID:
更多詳細教程,可以檢視:
《東莞酒店雲圖》:
《貪官羅馬圖》:
《三甲醫院雲圖》:
通過雲圖的雲檢索功能,檢索出自有資料中的“酒店”。并用圖檔為A-H的标注進行标示。
雲檢索:
檢索成功的回調函數:
添加Marker:
效果圖:
全部源代碼:
View Code
--------------------------------------------------------------------------------------------------------
【大家還想看到什麼内容,可以留言給我】
下一篇預告:
二、位址解析
1、位址解析 2、逆位址解析
三、導航規劃
1、公交導航 2、駕車導航 3、步行導航
四、定位
1、浏覽器定位 2、IP定位