• 沒有找到結果。

第二章 文獻探討

2.8 AJAX 和 VML

本系統的各使用者將經由網頁平台進行歷史教材的編輯或學習。而選擇使用 網頁平台的原因在於其具有不需額外安裝任何軟體便可操作的特性,且網頁內容 也不會有平台相依性的問題,只需依靠瀏覽器即可運行。並因為現今的作業系統 皆附有瀏覽器軟體,不需要使用者再另行安裝,所以可以大大減少使用者對於平 台及使用環境的限制。但正因為 Web 應用系統會受限於 HTTP 架構,其模式皆 屬HTTP Request → Web Server Process → HTML Page Reply 的流程,所以存在著 需 等 待 伺 服 器 回 應 時 間 過 長 的 問 題 。 所 以 本 研 究 也 希 望 能 透 過 AJAX

(Asynchronous JavaScript And XML)和 VML(Vector Markup Language)來針 對此問題做出進一步的修正。

2.8.1 AJAX(Asynchronous JavaScript And XML)

由於傳統網頁程式處理流程的問題(圖 2-24),使得網頁開發者和瀏覽者在 瀏覽網頁時皆會遇到傳統網頁應用程式 Request/Response 模式所造成的侷限性。

這是因為網頁本身是無狀態的,所以每當網頁資料或使用者介面需要變更時,就 必頇向伺服器提出將整個網頁更新的要求。這也代表著,網頁畫面的產生是由客 戶端和伺服器端不斷的溝通,才會在瀏覽者介面上顯示出網頁畫面。但如果在這 兩端間有極大量的資料時,將會造成因為資料傳輸過於頻繁往返,而使得使用者 等待畫面出現的時間過於漫長。

AJAX(Asynchronous JavaScript and XML)的出現,使得客戶端可以只向伺 服器發送並取回必需的資料。它結合 XML 傳輸資料與大量使用客戶端 Script。

讓開發者可以客戶端 Scripts 的方式透過 XMLHTTP 來進行非同步的網頁呼叫服 務。且因為透過非同步的方式進行呼叫,使得網頁中的資料與使用者的瀏覽介面 不需要進行客戶端與伺服器端之間的往返,所以 AJAX 能具有較少的資料傳送與 較佳的應用程式效能,於是瀏覽者就可以更快速的在他們的瀏覽器上看到網頁畫 面。

它最大的優點,就是能在不更新整個頁面的前提下維護資料。這會使得整個 網頁程式處理流程(圖 2-25)更迅捷地回應客戶端動作,並且能避免在網路上發 送一些多餘且浪費的訊息(Garrett, 2005)。且非同步的呼叫方式能夠使得網頁應 用程式能有更優良的反應,因為使用者的呼叫工作可以在伺服器端執行的同時,

於客戶端的瀏覽器內繼續進行工作。

圖 2-24:傳統網頁程式處理流程(Garrett, 2005)

圖 2-25: AJAX 網頁程式處理流程(Garrett, 2005)

因而本研究使用 AJAX 技術來讓網頁應用程式能有更優良的反應效率,這是 因為本系統在呈現空間地理資訊時需要讓客戶端和伺服端互相傳送大量資料,所 以會有讓客戶端上的瀏覽者等待伺服端回應時間過久的可能。因此,本研究使用 AJAX 的技術來改善 HES-SPATO 中呈現地圖空間資訊的部分,使其擁有近似於 Google Map 的能力。

2.8.2 VML(Vector Markup Language)

VML 是一種 XML 語言用於繪製向量圖形(Vector Graphics)。由微軟

(Microsoft)、Autodesk、惠普(Hewlett-Packard)、Macromedia 和 Visio 公司於 1998 年 5 月所提出,定義了將圖形向量資訊和標記結合的格式,作為描述向量 資訊,及顯示、編輯修改的方式,使用 VML 所描繪出的圖形可以支援以 2D、

3D、動畫的方式呈現。

VML 的結構與 HTML 和 CSS 的結構相似,因此在解讀及修正的時候都十分 地容易被操作(圖 2-26),也就是說,VML、HTML、CSS 這三者很容易被摻雜 在一起使用且相容性也高。且由於以 DOM(Document Object Model)的形式表 達,所以和 JavaScript、VBScript 這類的 DHTML 語言也具有相容性。在 VML 中,圖形的形成方式是由相連接的線條和弧線所描述出的路徑所組成,因此,目 前在 Google Maps 中被拿來與 AJAX 做結合輸出向量圖形。

圖 2-26 :VML 的工作流程(Mathews et al., 1998)