基于Ajax的城市公眾服務系統實現

鄭 莉，羅躍軍

(1.武漢大學測繪學院，湖北武漢430079;2.光庭導航數據(武漢)有限公司，湖北武漢430073)

基于Ajax的城市公眾服務系統實現

鄭 莉1，羅躍軍2

(1.武漢大學測繪學院，湖北武漢430079;2.光庭導航數據(武漢)有限公司，湖北武漢430073)

為提高公共服務平臺空間信息資源共享的服務效率和能力，針對當前應用廣泛的瓦片式地圖服務模式，探討基于Ajax的瓦片式地圖服務研究，開發(fā)對應的瓦片式切圖工具，為空間信息資源共享提供數據保障。試驗結果表明，該系統具有很高的瓦片切圖效率，對提高傳統WebGIS的響應速度具有較高的應用價值。

瓦片地圖;切割;合成;Ajax;公眾服務系統

一、引 言

隨著城市建設的快速發(fā)展，城市中的各類信息資源也越來越多，各種信息資源與空間地理位置的聯系也越來越緊密，如何將城市中各行各業(yè)，種類繁多的信息資源與空間信息進行分類與整合，從而依托地理空間位置信息實現對信息資源的共享服務［1-2］，這已經成為城市信息化建設中急需解決的問題。建設地理信息公眾服務平臺，利用當前互聯網環(huán)境，整合相關信息資源，面向公眾提供地理信息服務，不僅可以降低地理信息應用的成本門檻，滿足公眾對地理信息資源使用的需求，而且可以更好地利用測繪成果為社會服務。傳統的WebGIS服務模式可以達到地理空間信息資源共享的目標，它可以實時請求地圖服務器傳輸地圖，但該模式消耗資源(如網絡負載、服務器負載等)相對比較大，因此，不能滿足多用戶、高并發(fā)的地理空間信息資源共享服務效率的要求。瓦片式地圖服務模式首先把空間信息數據按照特定的瓦片式切圖算法生成規(guī)矩的瓦片式地圖存儲于硬盤目錄下，然后以鏈接圖片的方式在瀏覽器中還原地圖［3］。該服務模式響應速度要快于傳統WebGIS服務模式，而且對地圖服務器的負載也相對小一些。本文就是針對當前應用廣泛的瓦片式地圖服務模式，探討基于Ajax的瓦片式地圖服務研究，開發(fā)對應的瓦片式切圖工具，為空間信息資源共享提供數據保障。

二、瓦片地圖服務的體系結構

瓦片式地圖可分為兩種：一種是客戶端瓦片技術，即在客戶端將本來只需一次請求即可獲得的地圖圖片分解為多次請求，由客戶端將這多次請求獲得的地圖圖片組合起來，形成一幅完整的地圖，但它對WebGIS服務器和網絡的荷載要求非常大;另一種是服務器端的瓦片技術，即預先在服務器上切割出金字塔結構的地圖圖片，讓客戶端來訪問，這種方式不涉及WebGIS服務器的解析和地圖生成過程，而是一個存儲的圖像加載，因此速度比客戶端瓦片技術和非瓦片式GIS快［4］。本研究是基于服務器端的瓦片技術，系統采用B/S架構進行設計開發(fā)，GIS數據處理平臺采用MapInfo 8.5，后臺數據庫使用Oracle、MySQL6以及自定義數據庫。系統采用的開發(fā)工具是 Microsoft Visual Studio.NET 2008、php5，以及Flex3等。平臺服務器環(huán)境為Red Linux Advance Server 5或者Windows Server 2003。應用平臺系統是自主開發(fā)的JavaScript地圖組件、ArcGIS Server 9.3以及Flash地圖組件等。瓦片地圖服務采用多層體系結構設計，系統由用戶層、瓦片地圖服務中間件和數據層構成，以增加應用系統的可伸縮性和靈活性。

三、瓦片切圖工具設計

1.瓦片地圖預先生成

本系統運用Ajax技術，客戶端與服務器可以進行異步多線程數據交互，在地圖服務中以分塊傳輸地圖。將瀏覽器地圖容器分割成尺寸相等(一般為256像素×256像素大小)的若干正方形地圖方塊，并根據客戶的操作，先從緩存中搜索相應的地圖數據，如果緩存中沒有對應的地圖數據，Ajax引擎會根據一定的算法計算出需要新加載的瓦片，以異步多線程方式向服務器發(fā)出請求。在用戶操作時候，使用JavaScript和DHTML立即更新地圖信息，并向服務器發(fā)出異步請求，以執(zhí)行更新或查詢緩存與數據庫。當請求返回時，就可以使用JavaScript和CSS來相應地更新頁面，而不是刷新整個頁面。地圖分塊技術極大地改進了客戶端和服務器端的交互效率，減輕了服務器負載和網絡傳輸負擔。

地圖緩存模塊用于存儲地圖數據，提高系統的效率，降低反應時間。當用戶訪問地圖的某一區(qū)域時候，系統將會讀取該區(qū)域臨近區(qū)域的數據，儲存在緩存中，方便用戶查詢。而用戶查詢的時候，系統會先從緩存中讀取，如果不能命中，系統會向數據庫查詢模塊發(fā)送請求，查詢地圖數據。當用戶在操作地圖的同時，系統會自動從后臺的服務器中讀取數據，存儲到緩存中，此時用戶還根本沒有意識到瀏覽器正在與服務器通信。而用戶訪問其他區(qū)域的時候，訪問就會變得非常流暢［5］。本系統采取LRU(least recently used)算法來動態(tài)置換緩存中的內容。LRU算法原理局部性原理是：在前面一系列操作中使用頻繁的區(qū)域很可能在后面的操作中頻繁使用。反過來說，已經很久沒有使用的區(qū)域很可能在未來較長的一段時間內不會被用到，所以在每次調換時，找到最近最少使用的那個區(qū)域并調出內存。

2.地圖切割與合成

地圖瓦片可由矢量地圖或柵格地圖切割而成。地圖切割程序根據投影類型、地理坐標、縮放級別、地圖瓦片像素大小等參數生成柵格形式的地圖瓦片，并用縮放級別、x坐標和y坐標等標識為圖片命名。圖1為圖片裁切具體流程，先將圖片加載進來，在裁切時，需要明確產生Cells數組的大小以及影像對象，并告知影像中每個圖片的大小，則圖片會自動初切割成等尺寸的畫面(Tile);然后將處理后的圖片寫入到目錄中。網站在使用這些圖片時，會根據圖片裁切原理，通過工具組合還原成需要的圖片，并顯示在網站的頁面中。不過當影像數據很大時，需要考慮建立文件索引，但這會引起性能下降。建議將裁切工具作為單獨工具，而不進行實時切片。

地圖的合成由Ajax引擎在客戶端完成。Ajax引擎首先分析瀏覽器地圖容器中的當前縮放級別、地理坐標和容器大小等參數，計算出需要哪些地圖瓦片;然后異步并發(fā)地向服務器發(fā)出請求，當地圖瓦片返回后，將其放到瀏覽器地圖容器中的正確位置上。各相鄰地圖瓦片均無縫隙，所有瓦片合成后在用戶眼里是一整塊地圖，圖2為圖片合成具體流程。

圖1 圖片裁切流程

圖2 圖片組合顯示流程

四、地圖搜索技術優(yōu)化

1.地圖搜索

所謂地圖搜索，就是用戶在地圖搜索引擎界面下，輸入想要查找地點的關鍵字，便可在地圖窗口中定位整個城市范圍內想要查找的街道、建筑物等地理位置，并獲得相關地圖信息［6］。城市公眾服務系統擁有精準而充實的地理信息庫，最新的興趣點(POI)信息，擁有高性能的搜索技術，在為用戶提供精準搜索的同時，具有優(yōu)良的搜索反應速度。

地圖搜索(如圖3所示)實現具體流程如下：①在Web瀏覽器的地圖搜索界面下，用戶選擇“區(qū)縣列表”中的區(qū)縣(默認為城市)，并且輸入欲搜索的街道、商業(yè)建筑等興趣點的關鍵字，點擊搜索按鈕;②客戶端通過JavaScript腳本，獲得用戶想要搜索信息的“區(qū)縣”、“關鍵字”等搜索條件，建立與服務器端的連接，向服務器端發(fā)送請求(以“Get”方式向服務器發(fā)送請求);③Web服務器接收客戶端的請求，分析搜索條件，確定用戶激發(fā)的搜索類別，繼而確定具體的搜索引擎;④建立與數據庫服務器的連接，根據不同的搜索引擎，在數據庫服務器上搜索滿足要求的信息;⑤Web服務器向客戶端返回搜索結果(以XML文件返回結果);⑥在Web瀏覽器的地圖搜索界面下輸出搜索結果列表(POI名稱、地址、詳細信息鏈接)，如果搜索的是街道，則在地圖顯示窗口中畫出街道中心線;如果搜索的是興趣點，則在地圖顯示窗口中以字母或數字標出搜索到的興趣點地理位置。

圖3 地圖搜索流程

地圖搜索模塊中采用了Ajax技術，目的是增強地圖搜索界面的互動性，使地圖搜索程序可以像桌面應用程序中常見的動態(tài)用戶界面和漂亮的控件一樣，并減少客戶端從服務器端請求少量信息，而不是整個網頁，增加頁面的數據更新但同時減少頁面的刷新和刷新等待，減輕空間服務器的同時改善用戶體驗?？蛻舳耸墙柚贏jax技術，利用JavaS-cript語言，實現與服務器端的異步數據請求，保證用戶無需等待服務器端的響應而繼續(xù)進行其他操作。

2.周邊搜索

周邊搜索顧名思義就是在哪里找什么，也就是查詢或搜索以某一位置為中心的周邊感興趣的信息。輸入地理信息名(指搜索中心地址、地標建筑物、POI名稱或是行政區(qū)劃名稱)，以及中心位置周圍的生活信息關鍵詞，如餐館、KTV、銀行、藥店等，點擊搜索按鈕后，即可獲得中心位置周圍POI列表。還可設置搜索半徑，即用戶進行周邊搜索的時候，可根據自己的需要更改搜索半徑的大小。

周邊搜索具體實現流程如下：①在Web瀏覽器的周邊搜索界面下，用戶首先在中心位置欄中輸入中心地址、地標建筑物名稱或行政區(qū)劃等地理信息名稱，并同時周圍信息欄中輸入信息點關鍵詞，然后點擊搜索按鈕;②客戶端通過JavaScript腳本，獲得用戶想要搜索信息的“地理信息名稱”、“周圍信息的關鍵詞”等搜索條件，建立與服務器端的連接，向服務器端發(fā)送請求(以“Get”方式向服務器發(fā)送請求);③Web服務器接收客戶端的請求，分析地理信息名稱，如果是行政區(qū)劃名稱，則以該區(qū)劃中心為圓心，以指定的半徑為搜索半徑，進行信息點的搜索;如果是地標建筑物等名稱，則以該地標點為圓心，以指定的半徑為搜索半徑，進行信息點的搜索;④建立與數據庫服務器的連接，根據周邊搜索的搜索引擎，在數據庫服務器上搜索符合條件的興趣點;⑤Web服務器向客戶端返回XML文件形式的搜索結果;⑥ 在Web瀏覽器的周邊搜索界面下列出搜索結果(POI名稱、地址、詳細信息鏈接)，并在地圖顯示窗口中以字母或數字標出搜索到的興趣點地理位置。周邊搜索模塊實現所采用的技術與地圖搜索一樣。流程可參照圖3所示。

五、系統性能與實現

1.系統性能

為了測試本系統的實際性能，對系統的響應時間進行了測試。在Windows XP平臺下搭建試驗環(huán)境，測試使用的服務器是一臺IBM的PC級服務器，配置為Intel 2.8 GHz雙核處理器和4 GB內存。在客戶計算機上運行專門開發(fā)的測試程序，模擬單個用戶的平移、縮放和快速定位操作，用戶動作間隔設定為1 s。測試程序記錄每次動作的開始時間和完成時間，進而計算得到每個動作的等待時間。為了提高測試結果可信度，每次測試設定用戶分別進行3000次平移、縮放以及快速定位操作，測試結果如表1所示。從表1可以看出，平移操作的響應時間大約只有原來的1/5，縮放操作的響應時間大約是原來的1/4，快速定位的響應時間大約是原來的1/2，系統性能得到了較大的提升。

2.系統實現

圖5是興趣點搜索顯示，將查詢結果在客戶端瀏覽器中以列表的形式顯示，同時還將結果的位置在地圖窗口中標注。在查看一個結果的詳細信息時，并在地圖窗口中把當前查看結果的位置在地圖窗口中居中顯示。在本系統中周邊搜索功能主要是指用戶在確定一個位置后和一個距離范圍后，可以查找位于這個范圍內的服務提供商信息和服務信息，用戶界面如圖6所示。

表1 操作等待時間 ms

圖5 興趣點搜索

六、結束語

針對目前公眾對地理信息系統應用的迫切需求，本文設計開發(fā)的城市公眾服務系統，整合了多尺度、多時相、多源、多分辨率空間信息，采用金字塔空間結構來對地圖數據進行組織，對客戶端請求的地圖數據進行合理的分割與傳輸，并通過減少網絡傳輸的數據量來加快客戶端顯示效果，快速展示電子地圖，建立了一種高效的面向用戶提供地圖服務的技術解決方案運行機制，從而實現了面向社會公眾的空間地理信息服務，提高了公眾對地理空間信息作用的認知度，促進了地理空間信息向實用化、規(guī)范化、公開化、產業(yè)化方向的發(fā)展。

［1］ YANG C W，DAVID W W，YANG R X，et al.Performance Improving Techniques in Web-based GIS［J］.International Journal of Geographical Information Science，2005，19(3)：319-342.

［2］ KHARE R.Beyond Ajax：Accelerating Web Applications with Real-Time Event Notification［D］.Netherlands：Delft University of Technology，2005.

［3］ 錢志彬，趙衛(wèi)東.輕量級WebGIS中間件的設計與實現［J］.計算機工程，2006，32(23)：265-267.

［4］ MENNO K J.The Role of the Map in a WebGIS Environment［J］.Journal of Geographical Systems，2004，6(2)：83-93.

［5］ 王浩，喻占武，曾武，等.基于瓦片壽命和訪問熱度的海量空間數據緩存置換策略［J］.武漢大學學報：信息科學版，2009，34(6)：667-670.

［6］ 涂振發(fā)，喻光明，張純潔.基于Ajax和MapX的Web-GIS的體系及其實現［J］.華中師范大學學報：自然科學版，2008，42(1)：136-140.

Implementation of Urban Public Services System Based on Ajax

ZHENG Li，LUO Yuejun

0494-0911(2012)09-0074-04

P208

B

2011-09-02

測繪遙感信息工程國家重點實驗室專項科研經費資助

鄭 莉(1979—)，女，福建福鼎人，博士，講師，主要從事GIS及攝影測量與遙感的研究工作。