吳開興,范周艷
(河北工程大學,河北 邯鄲 056038)
?
MapXtreme下WebGIS的優化研究
吳開興,范周艷
(河北工程大學,河北 邯鄲 056038)
對WebGIS和MapXtreme的工作方式進行了簡要的介紹,分析了基于MapXtreme的WebGIS的不足之處,并針對這些不足進行了優化研究。由于服務器端效率的優劣直接影響到客戶端用戶的使用和體驗效果,因此提出了在WebGIS中使用Comet技術實現服務器信息推送,用客戶端地圖圖層來替代服務端地圖圖層。該優化方案能有效地改善通信效率,增強用戶體驗,且減小了應用系統本身的業務邏輯與MapXtreme之間的耦合度。
WebGIS;MapXtreme;Comet;AJAX;客戶端地圖圖層
Web的分布式計算技術與GIS相結合產生了WebGIS,它是利用Internet技術來擴展和完善GIS的一項技術。其核心是在GIS中嵌入HTTP標準的應用體系,實現Internet環境下的空間信息管理和發布。目前,WebGIS技術在鐵路工務系統中已有著廣泛的應用,MapXtreme是當前鐵路工務系統中主要的WebGIS解決方案之一,它具有強大的地圖化功能,包括地圖的繪制、顯示、編輯、查找、分析、圖層控制、地理編碼等。管理員只需在Web服務器上對MapXtreme進行編程和管理,用戶就能夠通過Web瀏覽器訪問到地圖信息。
總體來說,MapXtreme是瘦客戶端的工作方式。客戶端首先向Web服務器提交HTTP請求,遞交Form表單;Web服務器收到該請求后,把地圖操作請求提交給地圖應用服務;地圖應用服務在內部調用MapXServer響應用戶的操作請求,進行相應的空間分析和處理后,產生新的地圖圖片,返回給Web服務器;Web服務器再把該圖片嵌入到HTML頁面中并返回給客戶端瀏覽器[1],如圖1所示。

圖1 MapXtreme的工作方式
傳統的Web系統是基于同步的HTTP請求/響應模式。需要交互時,客戶端要填寫Form表單并提交到服務器,服務器經過處理后,返回給客戶端一個新的頁面。這種交互過程,會產生以下問題:
1) 用戶每一次的交互操作都要在客戶端和服務器端進行數據傳輸和交換,其中還包括大量的重復數據,造成信息冗余。
2) 客戶端提交請求之后,必須等待服務器返回數據。等待期間,頁面處于阻塞狀態,無法進行其他操作,這導致用戶工作效率大幅降低。
3) 服務器端只能被動接收請求,無法主動向客戶端發送數據。
圖層對于MapXtreme來說,是一種只在服務器端才存在的概念。在服務器端創建地圖圖層是一項復雜煩瑣的過程。過多地使用服務端圖層,還會使應用系統本身的業務邏輯與MapXtreme之間的耦合度增加,這與軟件開發中“低耦合、高內聚”的原則相背離。
1.Comet技術實現服務器信息推送
(1) AJAX技術
異步JavaScript和XML是指一種創建交互式Web應用的客戶端開發技術。AJAX(Asynchronous JavaScript and XML)的工作原理相當于在客戶端和服務器端之間增加了一個中間層,這個中間層被稱作AJAX引擎,實際上是一個比較復雜的JavaScript應用程序[2]。它允許用戶和應用程序之間的交互異步發生,用戶在提交相應的操作后,無須等待頁面刷新,可以繼續進行其他操作,AJAX引擎負責后臺的異步處理。另外,也并不是所有的用戶請求都提交給服務器,一些數據驗證和數據處理等都由AJAX引擎來做,僅向服務器發送必需的數據, 這就意味著可以在不重新加載整個網頁的情況下,對網頁進行局部的內容更新。傳統Web應用模型與AJAX Web應用模型對比如圖2所示。

圖2 傳統Web應用模型與AJAX Web應用模型對比
(2) 服務器信息推送的必要性
線路檢測是幫助鐵路工務人員掌握線路健康狀況的一項重要技術手段,如果能將檢測信息、分析結果及時通知給工務人員,相關部門就可以迅速組織調度,排除隱患,避免安全事故的發生。
對于Web類工務系統而言,線路檢測數據平臺和分析系統都是運行于服務器端的。要將服務器端的最新數據實時地發送到客戶端,需要客戶端不停地刷新頁面,或是使用AJAX技術在后臺定時請求。然而AJAX只是實現了單用戶的響應回調,當—個頁面中同時存在多個AJAX的異步時,用戶很可能修改了沒有顯示出來的數據,造成數據庫事務中“臟讀”或“幻影讀”的問題[3]。
(3) Comet技術
Comet技術是一項新的Web交互技術,它基于HTTP長連接,無須在瀏覽器安裝插件[4],以AJAX技術為基礎,能夠將服務器端的最新數據實時地“推”到客戶端。Comet技術很好地解決了傳統Web模式和AJAX技術中存在的不足。兩種Comet應用的實現模型如圖3所示。

圖3 兩種Comet應用的實現模型
① 基于AJAX的長輪詢(long-polling)方式
該方式以AJAX技術為基礎,用JavaScript調用XML HttpRequest對象發出HTTP請求,一直到服務器端有數據更新,并且客戶端接收后,立即斷開連接。客戶端在處理完服務器返回的信息后,再次發出請求,重新建立連接,等候新的數據。
② 基于iframe及htmlfile的流(streaming)方式
通過在HTML頁面里嵌入一個隱藏幀,將其SRC屬性設為對一個長連接的請求,服務器端就能源源不斷地往客戶端輸入數據[5]。但這些數據會先被傳輸到隱藏幀里,無法在主頁面直接調用。因此,在創建到服務端的iframe長連接時,需要指定一個回調方法,客戶端瀏覽器的JavaScript引擎在收到服務器返回的JavaScript調用時就會去執行代碼,完成對推送數據的具體操作。除非通信出現錯誤或連接重新建立,否則該連接不會關閉。
(4) Comet技術的實現
創建iframe長連接,并綁定回調方法主要代碼如下(JavaScript):
var Tunnel=function () {
this.tunnel=new ActiveXObject("htmlfile");
this.tunnel.open();
this.tunnel.write("");
this.tunnel.close();
this.open=function (src, cb) {
this.tunnel.parentWindow.callBack=cb;

∥創建連接,綁定回調操作方法
showAlarmWindow(alarm.entity); });
服務端定時檢查有無新報警數據,并將數據傳輸到客戶端的主要代碼如下(C#):
Response.BufferOutput=false;
Response.ContentType="text/html; charset=utf-8";
Response.AppendHeader("Connection","Keep-Alive");while (true) {AlarmInfo alarm;
if (AlarmBLL.HasNewAlarm(out alarm)) {
var map=MapUtilities.GetMapObject();
var coordinate=new MapInfo.Geometry.DPoint(alarm.經度, alarm.緯度);
System.Drawing.Pointpoint;
map.DisplayTransform.ToDisplay(coordinate, out point);
var jsObj=new { x=point.X, y=point.Y, entity=alarm };
Response.Write(string.Format("", JsonConvert.SerializeObject(jsObj)));}
System.Threading.Thread.Sleep(1000 * 30);}
2.在客戶端構造和疊加地圖圖層
(1) 客戶端地圖圖層
客戶端地圖圖層創建于客戶端,操控靈活,完全AJAX化,并且使富客戶應用(rich Internet application,RIA)[6]技術的表現力、交互性優勢得到了充分發揮。在WebGIS中用客戶端地圖圖層來替代服務端地圖圖層,可減少系統本身的業務邏輯對地圖框架的依賴程度。
客戶端地圖圖層是一種在客戶端網頁上創建的透明HTML層元素,這種層元素具有尺寸和三維空間屬性,將該層元素設定為與地圖圖片尺寸1∶1的比例,插入到地圖容器中;再通過CSS控制其空間屬性,使其處于與地圖圖片相同x、y坐標的不同z軸上方,這樣就構造出了一個客戶端圖層。因為網頁是平面化的,客戶端圖層在視覺效果上能夠與地圖圖片疊加,從而形成實際意義上的客戶端地圖圖層,如圖4所示。

圖4 圖層疊加空間示意圖
(2) 客戶端地圖圖層實現
構造客戶端地圖圖層的主要代碼如下:
var zIndex=999; ∥zIndex為空間向量
var container=Ext.get(containerID);
var layer=Ext.get(layerID);
if (container &&!layer) { ∥創建并插入圖層
zIndex += 1; }
在服務端,MapXtreme已經為地理坐標到屏幕坐標提供了轉換方法。網頁地圖重載時,客戶端先以AJAX方式從服務端獲取經過坐標轉換的業務數據,然后在AJAX回調函數中將業務數據創建為Dom元素,最后將這些Dom元素添加到客戶端地圖圖層。主要代碼如下(C#):
Ext.Ajax.request({

Ext.each(result, function (item, i) {∥將業務信息創建為img元素,并插入到指定地圖圖層(循環)
WebGIS在鐵路信息化進程中扮演著越來越重要的角色,MapXtreme是當前鐵路工務系統中主要的WebGIS解決方案之一。本文提出的MapXtreme WebGIS的優化設計方法,具有可靠的理論依據,并在鐵路工務系統的實際研發過程中得到應用。試驗證明,經過優化的MapXtreme WebGIS較傳統的WebGIS,在執行效率、響應速度、交互性和可擴展性等方面均有顯著提升。
[1] 趙亞蓓.基于WebGIS技術的鐵路工務地理信息系統的建立[J].測繪與空間地理信息,2009, 32(2):23-25.
[2] 黃浩,趙遼英,蘇程,等.基于AJAX技術的WebGIS系統設計[J].杭州電子科技大學學報,2011,31(6):87-90.
[3] 張家愛,孫飛.Comet技術在Web開發中的研究與應用[J] .煤炭技術,2011,30(12):89-91.
[4] 繆謹勵,陶留鋒,邢廷炎,等.基于Pushlet的實時WebGIS研究與實現[J].地理信息世界,2013(5):64-68.
[5] 周婷.Comet:基于HTTP長連接的“服務器推”技術[EB/OL].2007-08-13.[2014-06-30].http:∥www.ibm.com/developerworks/cn/web/wa-lo-comet/.
[6] 張宏,豐江帆,閭國年,等.基于RIA技術的WebGIS研究[J].地球信息科學,2007(2):100-103.
[7] 秦永平,汪群山.基于 WebGIS 的公共衛生預警預測系統設計與實現[J].計算機應用與軟件,2014(4):56-58.
[8] 劉書雷,李軍,陳宏盛,等.基于MapXtreme的WebGIS解決方案[J].計算工程與科學,2004(2):15-18.
[9] 成富.實戰Comet應用程序開發[EB/OL].2008-07-15.[2014-06-30].http:∥www.ibm.com/developerworks/cn/web/wa-lo-w2fpak-comet/.
[10] 蘭小機,段保霞,彭建偉.基于Ajax的WebGIS研究與應用[J].測繪科學,2009,34(2):77-79.
[11] 唐群,謝小魁.Ajax與WebGIS的集成研究[J].測繪與空間地理信息,2009,32(6):33-35.
“中海達杯”高校測繪青年教師講課競賽即將開始
[本刊訊] 7月31日至8月2日,“中海達杯”全國高等學校測繪青年教師講課競賽將在西安科技大學舉辦,共有來自全國數十所高校的136名青年教師將角逐各獎項,總人數較上年增加40%。
“中海達杯”全國高等學校測繪專業青年教師講課競賽由教育部高等學校測繪類專業教學指導委員會、中國測繪地理信息學會測繪教育委員會主辦,由廣州中海達衛星導航技術股份有限公司協辦。競賽每兩年舉行一次,每次都吸引了來自全國數十所高校的上百名教師參加,已成為我國最具規模和影響力的測繪教師講課競賽。
競賽課程包括測量平差、攝影測量與遙感、地理信息系統原理與應用等,采取預賽和決賽制。評委會根據選手的課程策劃、課堂教學組織、多媒體技術運用、是否符合大綱要求、課件與授課是否合理銜接等標準來進行評分。
競賽的意義不僅在于提供一個競技的舞臺,更重要的是提供一個學習和交流的機會,讓各高校教師互相學習,共同提高,促進測繪學科專業的教學改革和教學質量再上新臺階。
(本刊編輯部)
Optimization Research of WebGIS Based on MapXtreme
WU Kaixing,FAN Zhouyan
吳開興,范周艷.MapXtreme下WebGIS的優化研究[J].測繪通報,2015(7):109-112.
10.13474/j.cnki.11-2246.2015.0225
2014-07-01
吳開興(1962—),男,教授,主要研究方向為信息系統與信息安全、煤礦綜合信息化。E-mail:296674391@qq.com
范周艷。E-mail:hifanzhouyan@163.com
P208
:B
:0494-0911(2015)07-0109-04