孫素華,高國棟
(1. 衡水學院 數(shù)學與計算機學院,河北 衡水 053000;2. 石家莊鐵道大學 信息科學與技術(shù)學院,河北 石家莊 050043)
基于Ajax實現(xiàn)科技信息資源可視化研究
孫素華1,高國棟2
(1. 衡水學院 數(shù)學與計算機學院,河北 衡水 053000;2. 石家莊鐵道大學 信息科學與技術(shù)學院,河北 石家莊 050043)
Ajax通過異步交互技術(shù),提高了在B/S模式下服務器與客戶端之間的傳輸效率和響應速度.在科技信息數(shù)據(jù)量與日俱增的今天,利用Ajax技術(shù)管理這些數(shù)據(jù)并且以可視化的形式展示在人們面前,有效地表現(xiàn)和發(fā)掘數(shù)字化信息中包含的信息特征,從而使人們可以高效地獲取信息所表達的知識.
Ajax;科技信息;可視化;Google Maps
Ajax(Asynchronous Java Script and XML)一詞最早在2005年由Adaptive Path公司的Garrett J J提出.Ajax綜合了 JavaScript、DOM、XMLHttpRequest、XMI和 XSTL等現(xiàn)有技術(shù).其中 XML和 CSS、DOM、XMLHttpRequest和JavaScript是AJAX的核心技術(shù)[1].
1.1 XML和CSS
XML(Extensible Markup Language)即可擴展標記語言,它與 HTML一樣,都是標準通用標記語言.XML是Internet環(huán)境中跨平臺的,依賴于內(nèi)容的技術(shù),是當前處理結(jié)構(gòu)化文檔信息的有力工具.擴展標記語言 XML是一種簡單的數(shù)據(jù)存儲語言,使用一系列簡單的標記描述數(shù)據(jù),而這些標記可以用方便的方式建立,雖然XML占用的空間比二進制數(shù)據(jù)要占用更多的空間,但XML極其簡單易于掌握和使用,它是Ajax技術(shù)標準中推薦使用的作為服務器與客戶端通信的數(shù)據(jù)格式[2].
CSS(Cascading Style Sheet)是一組格式設置規(guī)則,用于控制Web頁面的外觀.通過使用CSS樣式設置頁面的格式,可將頁面的內(nèi)容與表現(xiàn)形式分離.頁面內(nèi)容存放在 HTML文檔中,而用于定義表現(xiàn)形式的 CSS規(guī)則則存放在另一個文件中或HTML文檔的某一部分,通常為文件頭部分.它在Ajax中CSS擔當表現(xiàn)層的角色,近年來利用CSS和DIV成為頁面布局的主流趨勢,給開發(fā)人員和頁面設計人員提供了很好的方法.
1.2 DOM
文檔對象模型(Document Object Model,DOM)是一種用于HTML和XML文檔的編程接口.它給文檔提供了一種結(jié)構(gòu)化的表示方法,可以改變文檔的內(nèi)容和呈現(xiàn)方式.我們最為關(guān)心的是,DOM 把網(wǎng)頁和腳本以及其他的編程語言聯(lián)系了起來.用 JavaScript對網(wǎng)頁進行的所有操作都是通過 DOM 進行的.DOM 屬于瀏覽器,而不是JavaScript語言規(guī)范里的核心內(nèi)容.Ajax中JavaScript正是利用特定的方法來獲得DOM對象,從而實現(xiàn)對對象的動態(tài)交互與更新,即達到無刷新改變頁面狀態(tài)的效果[3].
1.3 XMLHttpRequest
XMLHttpRequest是瀏覽器內(nèi)置的對象,它是整個 Ajax技術(shù)的核心部分.XMLHttpRequest 對象提供了對HTTP協(xié)議的完全的訪問,包括做出POST和HEAD請求以及普通的GET請求的能力.XMLHttpRequest可以同步或異步地返回Web服務器的響應,并且能夠以文本或者一個DOM文檔的形式返回內(nèi)容.
1.4 JavaScript
JavaScript是一種基于對象和事件驅(qū)動并具有安全性能的腳本語言.這是一門被許多人熟知的編程語言,它擁有自己的編程標準,最主要的是它可以直接在客戶端進行一些事件的處理,充分地發(fā)揮了客戶端的運算能力,這樣就不需要將用戶所提交的簡單的請求傳到服務器處理再傳回來,從而大大減輕了服務器的負擔[4].
Ajax 基本上就是把 JavaScript技術(shù)和 XMLHttpRequest對象放在 Web表單和服務器之間.當用戶填寫表單時,數(shù)據(jù)發(fā)送給一些JavaScript代碼而不是直接發(fā)送給服務器.相反,JavaScript代碼捕獲表單數(shù)據(jù)并向服務器發(fā)送請求.同時用戶屏幕上的表單也不會閃爍、消失或延遲.換句話說,JavaScript代碼在幕后發(fā)送請求,用戶甚至不知道請求的發(fā)出.更好的是,請求是異步發(fā)送的,就是說 JavaScript代碼(和用戶)不用等待服務器的響應[5].因此用戶可以繼續(xù)輸入數(shù)據(jù),滾動屏幕和使用應用程序.然后服務器將數(shù)據(jù)返回 JavaScript代碼,后者決定如何處理這些數(shù)據(jù).它可以迅速更新表單數(shù)據(jù),讓人感覺應用程序是立即完成的,表單沒有提交或刷新而用戶得到了新數(shù)據(jù).JavaScript代碼甚至可以對收到的數(shù)據(jù)執(zhí)行某種計算,再發(fā)送另一個請求,完全不需要用戶干預,這就是 XMLHttpRequest的強大之處[6].它可以根據(jù)需要自行與服務器進行交互,用戶甚至可以完全不知道幕后發(fā)生的一切,結(jié)果就是類似于桌面應用程序的動態(tài)、快速響應、高交互性的體驗,但是背后又擁有互聯(lián)網(wǎng)的全部強大力量.其工作流程如圖1所示:
3.1 信息可視化基本含義
“信息可視化”這一術(shù)語最早出現(xiàn)1989年GRobertson,S.Card與J.Mackinlay的論文中,可以看作是從數(shù)據(jù)信息到可視化形式再到人的感知系統(tǒng)的可調(diào)節(jié)的映射[7].目前信息可視化已成為一個與科學可視化并列的研究領(lǐng)域.科學可視化的研究內(nèi)容包括圖像生成和圖像理解兩部分.按其結(jié)合程度將可視化分為3個層次:一是后置處理(postprocessing),即將科學和工程計算的結(jié)果解釋成可視圖形;二是實時跟蹤處理(tracking),即圖形可視化顯示與計算過程同步進行;三是交互控制(steering),表明在計算過程中根據(jù)顯示結(jié)果可隨時對模型和控制參數(shù)進行修改和引導.
3.2 信息可視化的基本特征信息可視化技術(shù)是現(xiàn)代信息管理技術(shù)的新成果之一,它具有以下主要特點:1)直觀形象性
信息可視化是通過生動、直觀、形象的圖形、圖像、影像、聲音、模型等方式,把各種信息展示給用戶,以便進行科技信息查詢和圖像分析.
2)多源數(shù)據(jù)的采集和集成性
運用信息可視化技術(shù),可方便地接收與采集不同類型、不同介質(zhì)和不同格式的科技信息.不論它們被收集時的形式是圖形、圖像、文字、數(shù)字還是視頻,也不論它們的數(shù)據(jù)格式是否一致,都能用統(tǒng)一的數(shù)據(jù)庫進行管理,從而為多源數(shù)據(jù)的綜合分析提供便利[8].
3)交互探討性
在大量數(shù)據(jù)中,交互方式有利于視覺思維.在探討分析的過程中,可以靈活檢索數(shù)據(jù),可以改變信息交互方式.多源信息集成在一起,并用統(tǒng)一數(shù)據(jù)庫進行管理,同時具有較強的空間分析與查詢功能,因此可以方便地對多源信息進行對比、綜合、分析,從中獲得規(guī)律,以用于人們規(guī)劃、決策和經(jīng)營.
4)信息的動態(tài)性
科技信息在可視化形式下不僅是空間信息,還表現(xiàn)為信息的動態(tài)性,并且信息的動態(tài)表示和動態(tài)檢索也成為可能.
5)信息載體的多樣性
隨著多媒體技術(shù)的發(fā)展,發(fā)達信息不在局限于表格、圖形和文件,而拓展到圖像、聲音、動畫、視頻圖像、三維仿真乃至虛擬現(xiàn)實等[9].
4.1 Google Maps開發(fā)功能分析
Google Maps作為Google Earth的后續(xù)產(chǎn)品,雖然和Google Earth有著本質(zhì)上的不同,但是在Google的產(chǎn)品鏈上卻分擔著Google“三維空間搜索”相輔相成的角色.目前針對Google Maps的二次開發(fā)應用正處于蓬勃發(fā)展的階段,國內(nèi)外都出現(xiàn)了不少這方面的應用[10].
Google公司于2005年推出了自己的Google Maps API,開發(fā)者可以利用它自行開發(fā)自己的Google Maps服務,而Google也可以通過API來對這些服務進行管理.開發(fā)者可以利用Google Maps API向公眾提供簡單而有效的地圖服務.可以嵌入大量的在線地圖和網(wǎng)絡服務,并且可以和數(shù)據(jù)庫結(jié)合起來,創(chuàng)建自己的應用程序.
用戶點擊客戶端“搜索”按鈕時,會根據(jù)數(shù)據(jù)庫坐標記錄以標注的形式展示的地圖上,也可進行標注點擊操作,會彈出一個信息框顯示該標注的詳細信息.整個過程中沒有發(fā)生全頁面刷新.這就是 Ajax所帶來的頁面局部刷新的效果.當客戶端向服務器端發(fā)送請求后,服務端返回給客戶端的信息只是客戶所需要的數(shù)據(jù).在客戶等待響應的過程中,客戶可以繼續(xù)在頁面上做其他操作,而不需要等待服務器端的響應.基于 Ajax技術(shù)的科技信息可視化開發(fā)模型如圖2所示:
圖2 科技信息可視化開發(fā)模型
4.2 功能實現(xiàn)
4.2.1 導入Google Maps API庫文件和創(chuàng)建地圖容器
首先,必須在網(wǎng)頁中導人Google Maps API庫文件.在HTML文件的Head部分加入如下格式的代碼:然后在 HTML的 Body部分加入一個具有 id屬性的元素作為 Google地圖的容器(通常會使用 DIV元素).另外,通過此元素還可以定義地圖大小和其他一些屬性:
4.2.2 功能代碼實現(xiàn)
在HTML的Head部分通過加入如下代碼導入functions.js文件.此文件包含了Google Maps及Ajax功能的全部內(nèi)容
initialize函數(shù)在網(wǎng)頁用于初始化Google地圖.通過它創(chuàng)建GMap2對象,添加Gcontrol控件,設置地圖中心位置.
Google Maps API為地圖服務的快速開發(fā)提供了可能.通過一個實例給出Ajax技術(shù)在Google Maps二次開發(fā)中的應用和實現(xiàn)方法.從而實現(xiàn)了用可視化的方法展示科技信息資源的目的,進而為人們有效地掌握科技信息提供了有利條件.
[1] 徐卓揆,劉德欽,林宗堅.AJAX技術(shù)在WebGIS中的應用[J].測繪信息與工程,2007,32(1):3-4.
[2] 謝小魁,陳大克.AJAX技術(shù)及其在WebGIS中的應用[J].計算機與信息技術(shù),2006(3):23-24.
[3] Ke im D A. Information Visualization and Visual Data Mining[J].IEEE Transactions on Visualization and Computer Graphics(TVCG), 2002(8):9-11.
[4] Card S. Readings in Information Visualization[J].Using Vision to Think MorganKaufmann,1999(1):10-14.
[5] 賀超凱.Ajax技術(shù)概述[J].電腦知識與技術(shù):學術(shù)交流,2007(11):761-762.
[6] 蘇世杰.利用Ajax改進Web應用的用戶體驗[J].電腦知識與技術(shù),2007(3):1381-1383.
[7] 王星,潘郁.基于Ajax技術(shù)的Web模型在網(wǎng)站開發(fā)中的應用研究[J].微計算機信息,2006,22(27):206-207.
[8] 孫曉茹,趙軍.Google Maps API在WEBGIS中的應用[J].微計算機信息,2006,22(7):5-6.
[9] 蘇玨,曾賢龍,藍天.Ajax在Web 2.0中的應用研究[J].電腦編程技巧與維護,2008(8):49-52.
[10] 劉凱.信息可視化概念的深入探討[J].情報雜志,2004(12):25-26.
Abstract:Ajax, through the asynchronous interactive technology, has enhanced the transmission efficiency and speed of response between the server and the client side under the B/S pattern. Since science and technology information data quantity grows quickly today, using Ajax technology management and visualizing these data for people, effectively expressing and exploring theinformation characteristics contained in the digital information can help people efficiently obtain information of knowledge.
Key words:Ajax; technology information; visualization; Google Maps
(責任編校:李建明英文校對:李玉玲)
Research on Achieving Te chnological Information Visualization based Ajax
SUN Su-hua1, GAO Guo-dong2
(1. College of Mathematics and Computer Science, Hengshui University, Hengshui, Hebei 053000, China;
2. School of Information Science and Technology, Shijiazhuang Tiedao University, Shijiazhuang, Hebei 050043, China)
U2;TP3
A
1673-2065(2011)01-0021-04
2010-08-23
河北省科技信息服務節(jié)點建設項目(2005DKA64201-06); 衡水學院科研資金資助項目(2008037)
孫素華(1970-),女,河北深州人,衡水學院數(shù)學與計算機學院副教授;
高國棟(1984-),男,河北滄州人,石家莊鐵道大學信息科學與技術(shù)學院2008級碩士研究生.