Home > TaiBIF > TaiBIF 使用 Google Maps JavaScript 第3版 API 地圖介紹

TaiBIF 使用 Google Maps JavaScript 第3版 API 地圖介紹

October 29th, 2010

TaiBIF(Taiwan Biodiversity Information Facility)使用 Google Maps 做為物種出現記錄的呈現工具,接下來的介紹將以盤古蟾蜍(Bufo bankorensis)的搜尋結果作為介紹所使用的頁面(網址如參考資料1)。

 

圖一 TaiBIF 地圖呈現情況

在圖一中我們可以看到畫面的幾個主要部分。

  1. 地圖部分:包含表示物種出現記錄的色塊、物種可能分布範圍,與高度剖面線。
  2. 海拔高度圖:地圖部分中兩紅色標記間黑色線的海拔高度圖。
  3. 色塊說明:在地圖部分中色塊的顏色所代表的資料數量。
  4. 統計數據:資料來源與筆數的說明。
  5. 功能開關:開啟與關閉地圖部分中的對應元件。
  6. 說明:地圖說明。
  7. 使用地圖:使用地圖。

 

地圖部分

TaiBIF 網站設定可顯示的縮放級別(Zoom Level)是由6到11,網頁載入時的預設縮放級別是6。色塊有三種規格,分別為代表40*40公里、10*10公里,與2*2公里的色塊,40*40公里色塊可出現的縮放級別是6、7、8、9;10*10公里色塊可出現的縮放級別是8、9、10、11;2*2公里色塊可出現的縮放級別是10與11。當10*10色塊出現時,40*40色塊會變成虛框,如圖二。物種可能分布範圍是將資料的座標值使用 Convex Hull 演算法(請參考參考資料5)計算而得的最小凸多邊形(smallest convex polygon)如圖三。高度剖面線包括兩個紅色標記圖示與一條黑色線,使用者可以拖曳紅色標記決定黑線的起始或結束位置如圖四。

 

圖二 色塊改變情況

 

圖三 最小凸多邊形

 

圖四 改變高度剖面線起始結束位置

 

海拔高度圖

是 Google Maps Javascript API 第3版開始的新功能,開發方式請參考參考資料3。如圖五當使用者將滑鼠游標移到海拔高度圖的高度線上面時,原本藍色的線會變成綠色的線,且在地圖部分的相對位置會出現一個綠色的標記表示游標所指的位置。當使用者將滑鼠游標移到高度線按下滑鼠左鍵時會出現這個高度線的海拔高度如圖六。

 

圖五 海拔高度圖情況一

 

圖六 海拔高度圖情況二

 

色塊說明

說明地圖部分中呈現的色塊所代表的資料筆數,會出現在地圖部分的資料都一定是有地理參照的資料。

統計數據

提供簡單的統計數據,包括資料提供單位、全部資料筆數、有地理參照資料筆數等。

功能開關

可以控制地圖部分中對應元件的顯示與隱藏,圖一中的元件包括色塊、物種可能分布範圍,與高度剖面線。 

說明

地圖部分的狀態說明,會隨著使用者的操作情況而動態更換。

使用地圖

使用者可以點此處連結開啟地圖服務頁並帶入參數,使用者可視需求在他們的網頁嵌入地圖服務頁。地圖服務頁中有連結到參數說明頁進而了解更多的參數使用方式。

參考資料

  1. http://taibif.org.tw/taibif_search/search_by_name.php?asc=Bufo+bankorensis
  2. http://taibif.org.tw/?tid=469&locale=tw
  3. http://code.google.com/intl/zh-TW/apis/maps/documentation/javascript/basics.html
  4. http://code.google.com/intl/zh-TW/apis/maps/documentation/elevation/
  5. http://en.wikipedia.org/wiki/Convex_hull_algorithms
Categories: TaiBIF Tags: ,
Comments are closed.