摘要:針對電子地圖交互操作過程中的響應速度問題,從地圖小圖像拼接的角度出發(fā),提出一種基于AJAX技術的電子地圖平滑移動算法。當對電子地圖進行平移操作時,地圖小圖像能夠迅速、平滑地拼接成為一幅完整的地圖圖像并顯示在客戶端頁面上。在此基礎上進一步給出相應的地圖初始化和縮放操作的實現(xiàn)方法。試驗結(jié)果表明,運用此方法可以迅速創(chuàng)建電子地圖,流暢地對電子地圖進行平移和縮放操作,有效地減少用戶操作間歇的等待時間,提高用戶的工作效率。
關鍵詞:圖像拼接;平滑移動;坐標變換;AJAX
中圖分類號:TP399
文獻標識碼:B
文章編號:1004—373X(2008)04—131—03
Web—GIS是集計算機科學、地理學、數(shù)學等為一體的新興科學。隨著網(wǎng)絡技術的不斷發(fā)展,Web—GIS也在更多的B/s應用軟件中得以發(fā)揮自己的能力。在這些應用軟件中,用戶與地圖之間的交互響應速度是一個決定軟件可操作性的重要標準。
初期的Web—GIS采用CGI方式。CGI是一種連接應用軟件和Web服務器的標準技術,是HTML的功能擴展。其優(yōu)點是程序簡單。但同時存在啟動時間長,反復裝載數(shù)據(jù)等缺陷。
隨后Applet,ActiveX等技術被用于客戶端的開發(fā)。他們嵌入網(wǎng)頁運行,功能較強,但其與服務端耦合度高,初次使用前要下載并安裝相應程序。這對普通用戶是種負擔,用戶在操作過程中常陷入長時間的等待。
AJAX技術的出現(xiàn)消除了網(wǎng)絡交互過程中的等待缺點,在從服務器讀取數(shù)據(jù)的過程中,用戶可以繼續(xù)使用其他功能而不必等待,這種異步傳輸?shù)奶匦允褂脩裟軌蚋恿鲿车貙Φ貓D進行操作。
本文在利用AJAX技術的基礎上提出一種利用HT—ML和JavaScript語言實現(xiàn)地圖平移的方法,即實現(xiàn)利用小圖像所在層的相對位置移動對地圖進行拼接和顯示。這種方法不在客戶端安裝任何插件,降低了客戶端的運行負擔,同時也減少了圖像數(shù)據(jù)的傳輸流量。此外,本文在此基礎上,也給出了相應的地圖縮放操作的實現(xiàn)方法。
1 AJAX相關技術
1.1 AJAX原理
AJAX(Asynchronous Java Script and XML)一詞最早在2005年由Adaptive Path公司的J.J.Garrett提出。AJAX綜合了JavaScript,DOM,XMLHttpRequest.XML和XSTL等現(xiàn)有技術。其中JavaScript,DOM和XMLHt—tpRequest是AJAX的核心技術。
1.2 地圖圖像的異步更新
一般來說,Web客戶端存在2種架構(gòu)模式:富客戶端和瘦客戶端。為了使電子地圖在客戶端的功能更加豐富,人們更多的采用富客戶端模式。在AJAX技術出現(xiàn)以前,Web—GIS通常采用諸如CGI,plug—in,Applet等技術進行軟件富客戶端的搭建。這些技術主要以表單提交作為通信方式??蛻舳艘訮OST方式向服務器提交圖像參數(shù),服務器根據(jù)參數(shù)生成圖像并傳回客戶端。在這個過程中,用戶只能等待而不能進行任何其他操作。
而基于AJAX的Web—GIS應用則可以通過異步更新的方式避免上述情況的發(fā)生。AJAX采用XMLHt—tpRequest代替POST方式向服務器發(fā)送請求,由于這個過程獨立于用戶與應用軟件之間的交互,故用戶可同時對地圖進行其他操作。如圖1所示是一個典型的基于AJAX的Web—GIS應用模型。
2 地圖坐標系
Web—GIS系統(tǒng)中存在幾種不同的坐標系,如圖2所示。服務器端通常存在一個地理坐標系,其用于確定地物在地球上的真實位置。最常用的地理坐標系是經(jīng)緯度坐標系,這種坐標系可以確定地球上任何一點的位置。
在客戶端存在另外z種坐標系,屏幕坐標系與邏輯屏幕坐標系。屏幕坐標系用于響應用戶對地圖進行的各種操作,其以瀏覽器窗口的左上角為原點,向右為x軸正方向,向下為y,軸正方向;邏輯屏幕坐標系用于在客戶端顯示地圖圖像,其在地圖初始化階段與屏幕坐標系原點重合,但隨著用戶對地圖進行平移操作,兩者之間便產(chǎn)生相對的位置偏移。
3 基于AJAX的電子地圖的構(gòu)建
電子地圖的構(gòu)建包括3個方面:地圖初始化、地圖平移以及縮放操作??蛻舳说貓D的構(gòu)建采用HTML和JavaScript語言實現(xiàn),其中每塊小圖像都以<Image>標簽表示,并放入一個與其尺寸相同的<div>標簽中。小圖像之間的拼接通過改變<div>標簽的相對位置來實現(xiàn)。
為方便表述,將文中所用符號做如下約定:屏幕坐標系表示為{S},其上的地圖視窗定義為矩形T,邏輯屏幕坐標系表示為{L},地理坐標系表示為{G},在邏輯屏幕坐標系中的客戶端地圖圖像由n×n塊正方形的小圖像拼接而成,每塊小圖像邊長為l,其左上角點的坐標表示為(ulx,uly),每塊小圖像所在的<div>的左上角點坐標表示為(divx,divy),z表示地圖的縮放比例,圖像用Imgij(i,j=0,1,…,n-1)表示,用戶平移地圖時的偏移量表示為(deltax,deltay),連續(xù)移動時總的偏移量表示為(sumDehax,sumDehay)。
3.1初始化地圖
地圖的初始化是指利用(G)中的點E的坐標(Ex,Ey),求(L}中n×n幅邊長為L的Img并進行拼接。
3.2小圖像拼接與地圖平移
對地圖的平移包括2種不同操作:根據(jù)(dx,dy)調(diào)整圖像所在層的相對位置;申請需要更新的小圖像。
3.3地圖的縮放
根據(jù)坐標系{S}中的點M的坐標(mx,my)得到其在坐標系(L)的對應坐標(mxl,myl)以及坐標系(G)的對應坐標(mx2,my2),用得到的坐標代入算法1中,便可實現(xiàn)地圖的縮放功能。
算法3 Zoom Map procedure
Begin
將sumDeha,與sumDeltay加和至M的坐標
清空sumDeltax與sumDeltay
根據(jù)M在{L}中的坐標計算其在(G)中的相應坐標時
將M代入算法1中
End
3.4 基于AJAX的電子地圖實例及分析
本文所述方法的試驗環(huán)境如下:服務器端,以tom—cat5.5作為Servlet容器,使用Mapxtreme for java 4.7作為電子地圖開發(fā)平臺;客戶端以HTML及JavaScript作為編程語言;實驗地圖數(shù)據(jù)采用Mapxtreme for java 4 .7自帶的世界地圖。
基于上述方法,以N=4為例,在客戶端拼接成一幅完整的世界地圖圖像。小圖像邊長L為200 px。沒矩形A為邊長等于2×L的正方形,則在其內(nèi)部可以顯示拼接后地圖中間的4幅小圖像,圖3分別給出4幅小圖像在初始化、平移、縮小和放大操作后的拼接效果示意圖。
在地圖的響應速度方面,采用神州龍地圖網(wǎng)提供的地圖(http://WWW.668map.com)與百度地圖(http://map.baidu.com)兩個在線地圖服務程序與使用本文中算法的電子地圖程序作對比試驗,神州龍在線地圖是基于Applet技術開發(fā)的電子地圖;而百度地圖提供的是基于AJAX技術的電子地圖。試驗過程分“初始化”、“平移”和“縮放”3個測試內(nèi)容,其中“初始化”采集樣本20次,其他2項測試內(nèi)容各采集樣本50次。分別記錄用戶操作間歇的等待時間。試驗結(jié)果如表1所示。
基于上述試驗數(shù)據(jù),可以看出基于Applet的電子地圖由于需要初始化時裝載數(shù)據(jù),故初始化速度是非常慢的,而基于AJAX的電子地圖的初始化速度就要快得多,使用本文方法的地圖在初始化速度上和百度地圖無太大差別;在平移和縮放操作方面,由于Applet在初始化階段把地圖下載到客戶端,隨后的操作幾乎沒有網(wǎng)絡傳輸,因而速度較快,而使用本文方法的地圖雖慢于神州龍地圖,但是相對于百度地圖來說,縮放操作幾乎持平,而平移操作還有一定的優(yōu)勢。
4 結(jié) 語
本文從基于AJAX技術的Web—GIS方向出發(fā),提出一種對電子地圖進行初始化、平滑移動和縮放的實現(xiàn)方法。分析基于AJAX技術的電子地圖初始化、平移以及縮放算法,最終用HTMI,和JavaScript語言實現(xiàn)上述功能。
論文初步給出一種依靠AJAX技術實現(xiàn)電子地圖基本操作的方法。還將進一步在圖像分塊數(shù)量,圖像塊的尺寸等方面進行研究,嘗試提高電子地圖平滑移動算法操作的效率。