相信看了 Uramp API - 02 ,你已經對UrMap API有了基本的概念,稍微有程式底子的人應該能舉一反三,直接看 UrMap API說明文件 寫出想要的功能.如果你還是一知半解,沒關係!接下來還會陸續在介紹越來越多東西,甚至還會做一些範例供大家參考!

這個章節開始我要講的是UMap的部分函式(有些太艱深且跟其他東西關聯性較大的後面再補充!).

(表格內容取自 UrMap API文件 )

建構式說明
UMap(container)                        在指定的 HTML container(HTML element,通常是一個 DIV element) 內建立一個地圖。

函式說明
addControl(type)在地圖上要加入要使用的控制列
centerAndZoom(latLng, zoomLevel)將地圖的中心點移動至指定的經緯度坐標 latLng(ULatLng) 並縮放到指定的顯示層級 zoomLevel(integer)。若是新的中心點也位在原本的地圖範圍之內時,地圖會以滑動的方式移至新的中心點。
centerMap(latLng)將地圖的中心點移動至指定的經緯度坐標 latLng(ULatLng),不改變目前的顯示層級。
zoomMap(zoomLevel)將縮放到指定的顯示層級 zoomLevel(integer)。目前所支援最小的 zoomLevel 值為 0,最大為 10* (1.06版起才開放到 10)
zoomIn()將地圖放大一個顯示層級。
zoomOut()將地圖縮小一個顯示層級。
refreshMap()重新顯示目前的地圖。
checkResize()當地圖的 container 元件大小改變時,須呼叫此一函式以提醒 UMap 物件重新計算並調整地圖涵蓋範圍。
setMapType(type)設定要使用的地圖模式,有電子地圖(U_MAP_TYPE)、衛星影像(U_SATELLITE_TYPE)及衛星地圖(U_HYBRID_TYPE)等三種模式可以設定。
setMapAction(action)設定要使用的地圖操作模式,有平移模式(U_PAN_ACTION)、測距模式(U_MEASURE_ACTION)及框選模式(U_BOX_ACTION)等三種。
enableDragging()開啟地圖可被拖曳的功能。
disableDragging()取消地圖可被拖曳的功能。當此一函式呼叫後,地圖僅能透過程式呼叫方能改變中心位置,滑鼠將無法拖動地圖。
showControls()顯示所有已加入的控制列。
hideControls()隱藏所有已加入的控制列。
getCenter()取得目前地圖中心點的經緯度坐標(ULatLng)。
getZoomLevel()取得目前地圖的顯示層級(integer)。
getCurrentMapType()取得目前使用中的地圖模式,其值可能為電子地圖(U_MAP_TYPE)、衛星影像(U_SATELLITE_TYPE)及衛星地圖(U_HYBRID_TYPE)等三種。
openInfoWindow(latLng, html, dialogWidth?, dialogHeight?)在地圖上的 latLng(ULatLng) 經緯度位置上開啟一個訊息視窗,視窗的內容為 html(string,內容可包含 HTML 語法)。若要控制訊息視窗的大小,可選擇性傳入 dialogWidth 與 dialogHeight 參數,代表訊息顯示區域的長寬 pixel 值,若未傳入則使用預設大小。
closeInfoWindow()關閉地圖上的訊息視窗。
savePosition()將目前地圖顯示的地點記錄起來。
returnToSavedPosition()將地圖回復到上一次記錄的地點。


  看這麼多東西,看的頭都暈了對不對?沒關係,「To see is to believe!」(眼見為憑),現在我們把所有列出的功能用一些方法讓你可以看到其中的變化,讓你自己實驗看看,分辨功能的差別與用途.

首先,第一個範例,我們所要介紹的是addControl()這個函式,他主要是讓地圖上便增加控制列,目前提供的選項有四種,U_FULLZOOM_CONTROLU_MINIZOOM_CONTROLU_TYPE_CONTROLU_SCALE_CONTROL

U_FULLZOOM_CONTROL(與U_MINIZOOM_CONTROL只能則一)
 可控制比例大小

U_MINIZOOM_CONTROL(與U_FULLZOOM_CONTROL只能則一)
 可控制比例大小

U_TYPE_CONTROL
 
可選擇地圖模式

U_SCALE_CONTROL
  可觀看比例尺

現在讓我們來試試看


 (以下為範例程式碼 記得更改授權碼)
arrow
arrow
    全站熱搜

    hellolucky 發表在 痞客邦 留言(0) 人氣()