• 沒有找到結果。

網站架設與網頁編輯

第三章 教學網站設計

第一節 系統架構

1. 網站架設與網頁編輯

全球資訊網(world wide web, www),是由所有互相連接的超文字(hypertext)

文檔組成的集合,透過網際網路存取。每一個文檔都由一個統一資源定位符

(Uniform Resource Locator,URL)指定其網路位址,當網路使用者在瀏覽器網址 列中輸入URL,瀏覽器就會從網頁伺服器取回稱為「文檔」或「網頁」的資訊並 顯示出各種各樣的網頁。

本研究的目標之一是建置供師生使用的教學網站,因此首先使用Windows 作 業系統內建的Internet Information Services(IIS,網際網路資訊服務)伺服器軟體 架設網頁伺服器,該伺服器之主機實體位於台大地理系地圖與多媒體研究室,網 路位址為140.112.63.87。伺服器之軟硬體配置完成之後,即可指定伺服器中任何 實體路徑,設定為虛擬目錄,放置在路徑中的檔案向網路開放與共享。舉例而言,

若有一純文字檔案命名為document.txt,若使用者需要存取該文字檔,可以在瀏覽 器中輸入http://140.112.63.87/document.txt,即可透過網路存取該文字檔。

網站是指網際網路上根據一定的規則,使用HTML(超文本標記語言,

HyperText Markup Language)等工具製作的用於展示特定內容的相關網頁的集合,

這意味著一個網站之下會包含許多內容與網站主題相關聯的網頁。根據這個定義,

本研究以文字編輯器編輯合乎標準的HTML 檔案,設計一系列教學服務的網頁並 放置於網路伺服器的虛擬目錄中,供教師與學生在網路瀏覽器中存取。

Google Ma Google Ma guage)編寫

how, 2008)

aps API

vaScript 和 這樣的結構是 Google Map 功能,因此目 Google Map

ogle Maps A s 介面,包含 目前網路上對 結尾附上一小

圖API 供網

Xtensible Ma 存取Google

入Google M

圖3.1 說明

Google Ma 去使用者只能 oogle Maps 料傳輸協定

,Google M 之後輸出為圖

碼從直接讀取Google Maps。

由於Google Maps 的使用介面已經擁有衛星影像、交通路網和大比例尺電子地 圖的資料,所以以Google Maps API 為基礎,配合符合開放式地理資訊系統協會

(OGC, Open GIS Consortium)標準的地理標記語言(Geographic Markup Language, GML)就可以完成一個具備資料展示和查詢的網路 GIS 原型(Chow, 2008)。

本研究建構的系統要以Google Maps 的操作介面作為基本,所以首先要使用的 工具就是Google Maps API。由於 Google Maps、Earth 在教育上的應用已經吸引許 多一線教師的注意,所以使用Google Maps API 建構教師與學生較熟悉、具親和力 的地圖介面,是本研究開發的教學網站中十分重要的一部分。

由於本研究的網頁伺服器位於網路位址140.112.63.87 之主機,使用者瀏覽本 研究設計之教學網頁時,皆是透過http://140.112.63.87 為開頭的 URL 讀取,而不 是Google Maps 之官方網站,所以如果需要在網頁中使用 Google Maps API,需要 事先以140.112.63.87 之位址申請金鑰。金鑰是亂數排列、獨一無二之英文字母與 數字的組合,用於辨識網站之位址,如果沒有申請金鑰或是使用不符合的金鑰,

網頁中的Google Maps 將無法正常顯示。

在文字編輯器中設計教學網頁時,最重要且常用的Google Maps API 之語法如 下:

A. <script

src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;ke y=金鑰"></script>

<script type="text/javascript">

宣告在本網頁中引入JavaScript 之語法,來源為 Google Maps,運用在來源為 140.112.63.87 之網頁中。所有 Google Maps API 之指令才能運作。

B. function initialize() {

var map = new GMap2(document.getElementById("map_canvas"));

}

_canvas 之框

nter(new GL 之map 變數

這個系統完整 ect Containe

OC 則是服

整的GIS 功 RI 的 ArcGI ArcGIS 軟體 S 系統的分

定,Interne

圖3.4 ArcG

者(Server Ob 組成,都是 et Protocol,

GIS Server 系

bject Manag 是用於服務

ArcGIS Serv 本架構如下

Server 度;

可以

在同一部電腦主機中,也可以由一部電腦主機擔任SOM,管理其他做為 SOC 的電 腦。

B. 網路伺服器

負責網路應用程式(Web Application)的運作,網路應用程式是透過網路瀏覽 器在網際網路上使用的軟體,廣泛運用於生活的各種層面,例如電子郵件信箱。

ArcGIS Server 架構中的網路伺服器是透過傳遞指令給 GIS 伺服器,由伺服器執行 GIS 功能,並將結果送回網路伺服器,然後再傳送到用戶端。

C. 客戶端軟體

包括單機版ArcGIS 軟體、ArcGIS Explorer 等,客戶端可以直接使用這些軟體,

無需自備資料或功能擴充模組,透過網路存取位於GIS 伺服器的資料和各類服務。

因為這兩種軟體由於同屬ESRI 產品,所以和較複雜的向量或網格資料是相容的,

無須經過轉換即可正常讀取。

D. 網路瀏覽器

例如微軟IE、Google 瀏覽器、Firefox 等,無法取得客戶端軟體的使用者也能 透過網路瀏覽器存取來自網路伺服器的資料來使用網路GIS 系統,兩者的差異在 於瀏覽器無法支援shapefile 和網格資料這類複雜的資料格式,所以必須經由 GIS 伺服器將資料轉換為.jpg、.svg 或 GML(地理標記語言,Geography Markup Language)、.kml 等相對較為輕量的資料格式才能供瀏覽器使用。

雖然ArcGIS Server 如前述架構可以經由分散式架構提升效率,但是在本研究 中,GIS 伺服器之 SOM、SOC 和網路伺服器實際上都集中配置於前述位於台大地 理系地圖與多媒體研究室之主機,位址為140.112.63.87。這是因為本研究著重於 系統開發,原型系統研發階段的優先考量在於研究目標的實現,同時囿於資源與 設備,亦無法進行商業規模之配置。本研究使用之ArcGIS Server 為台灣大學購置 之授權版本,選用該套裝軟體的考量如下:

A. ArcGIS Server 所發佈的服務涵蓋單機版 ArcGIS 的大部分主要功能,包括地圖 服務、地理編碼、地理資料管理、地理處理服務(Geo-processing service)、路

網分析服務等等,本研究可以針對高中地理資訊教學的需求,設計並發布各 種網路服務。

B. 上述由 ArcGIS Server 發佈的服務不僅可以讓使用者透過網路存取,在使用者 的單機版ArcGIS 中使用,也可以透過簡單物件存取協定(Simple Object Access Protocol,SOAP)和應用程式介面(Application Programming Interface,API)

藉由網路瀏覽器和行動裝置存取使用。這在本研究中至關緊要,因為前言提 及的高中教學現場的其中一個困境就是單機版ArcGIS 軟體在使用地點和教學 資源上的局限性,所以使用ArcGIS Server 針對高一 GIS 單元建構網路 GIS 的 一大突破在於使教師和學生如果可以在課間或課餘時間使用網路,就能透過 瀏覽器立即使用網路GIS 服務,不需使用技術門檻較高且較難學習的專業軟 體。配合Google Maps API 的操作介面,更能夠將 GIS 的空間資訊內涵和生活 環境相結合。

C. 上述的服務都符合開放式地理資訊協會(Open Geospatial Consortium,OGC)

定義的標準,包括將瀏覽器可支援的地圖圖檔發佈給服務使用者的網路地圖 服務(Web Map Service,WMS)、使用者可以透過網路由伺服器取得並更新 GIS 資料的網路圖徵服務(Web Feature Service,WFS)和 KML & KMZ 格式。

這些統一的開放格式不僅能使教師和學生可以更容易取得地理資訊,而且能 夠將之運用在其他的開放網路資源,例如Google Earth & Maps,對於不同服 務和資料來源的互操作性(Interoperability)有較大的彈性,遠優於商業 GIS 軟體。

在本研究中,透過ArcGIS Server 發佈的網路 GIS 服務大致可分為兩大類,分 別是地圖服務(map service)與地理處理服務(geo-processing service)。地圖服務 是將各種GIS 圖資發佈為網路服務,使用者可以透過 GIS 軟體或瀏覽器檢視這些 圖層,並對圖資進行空間或屬性查詢。地理處理服務則是將GIS 功能根據預先設 計好的處理流程組合成模型(model)並發佈為網路服務,和地圖服務的不同在於 地理處理服務通常是為了處理特定問題而設計,可以由使用者輸入變數,此變數

可以是數值、文字或使用者指定的位置,經過模型處理之後將成果傳回至使用者。

另一方面,ESRI 亦有發佈一系列基礎的幾何分析功能,例如環域分析、面積 與周長計算等。所有開發者皆可以由ESRI 之 ArcGIS Server 官方伺服器免費取用 這些服務,或是和本研究中發佈的服務相結合,設計出更複雜完整的網路GIS 功 能。以下的列表為本研究中使用與發佈的網路GIS 服務清單,這些服務皆是考量 教學的角度和需要而設計的:

表3.1 本研究發佈之地圖服務一覽

台灣鄉鎮市區行政區

圖資的屬性資料包含鄉鎮名、隸屬縣市、行政區全名 與代碼、土地面積、人口統計(含總數、男女性人口 數、幼壯老年人口數、性別比例)

台灣村里行政區

圖資的屬性資料包含村里名、隸屬鄉鎮、隸屬縣市、

行政區全名與代碼、人口統計(含家戶數、總人口數、

男女性人口數、移入移出人口數)

台灣各級學校點位 圖資的屬性資料包含學校代碼、校名、所在縣市、地 址、學校類型

台北市大安區土地利用

使用內政部國土測繪中心之民國96 年台北市國土利 用調查資料,可查詢詳細的土地利用現況;並備有向 量式、網格式(解析度5M、10M、20M)兩種格式 供教學時進行比較

台灣地區數值地形模型 使用ASTER 衛星量測之台灣地區 DEM,網格解析 度為30M,並將網格像素根據海拔高度分層設色 台灣地區向量等高線 由上述之ASTER DEM 經 contour 工具處理而得,共

有50M 和 100M 兩種間隔

台灣地區地形黑白暈渲 由上述之ASTER DEM 經 hillshade 工具處理而得,

用於立體化的地形展示效果

台灣地區坡度圖 由上述之ASTER DEM 經 slope 工具處理而得,作為 GIS 地形分析之範例

表3.2 本研究發佈之地理處理服務一覽

台灣地區海平面上升模擬

在單機GIS 軟體中繪製淹水模擬圖通常是將 DEM 的網格重分類(reclassify)而成,本研究將此作業 流程發佈為網路服務,使用者只需輸入淹水高度 值,伺服器即會將全台淹水範圍傳回客戶端

北北基地區視域分析

結合viewshed 工具和北北基 DEM 資料,發佈為網 路服務,使用者在北北基範圍之內點選地圖,伺服

結合viewshed 工具和北北基 DEM 資料,發佈為網 路服務,使用者在北北基範圍之內點選地圖,伺服

相關文件