Google Maps API - 新增地圖控制項、地圖類型

‧地圖控制項

在使用 Google Map 時會有地圖縮放及地圖類型切換等控制項，這裡可以使用 GMap2 物件的方法 addControl(control) 來新增地圖控制項。
<br />var myMap = new GMap2(document.getElementById("my_map"));<br />myMap.setCenter(new GLatLng(25.08532, 121.561498), 11);<br /> <br />myMap.addControl(new GLargeMapControl());<br />myMap.addControl(new GMapTypeControl());<br />
看範例所呈現的結果

如果要將已經存在地圖上的控制項移除，可以使用 GMap2.removeControl(control)。
<br />var myMap = new GMap2(document.getElementById("my_map"));<br />myMap.setCenter(new GLatLng(25.08532, 121.561498), 11);<br /><br />var myGLargeMapControl = new GLargeMapControl();<br />myMap.addControl( myGLargeMapControl );<br />var myGMapTypeControl = new GMapTypeControl();<br />myMap.addControl( myGMapTypeControl );<br /><br />myMap.removeControl( myGLargeMapControl );<br />

可使用的控制項如下︰

GLargeMapControl() 帶有可在四個方向平移、放大、縮小的按鈕，以及縮放滑塊的控制項。
GSmallMapControl() 帶有可在四個方向平移、放大和縮小的按鈕的控制項。
GSmallZoomControl() 帶有放大和縮小按鈕的控制項。
GScaleControl() 顯示地圖比例尺的控制項。
GOverviewMapControl() 可摺疊的迷你地圖控制項。
GMapTypeControl() 帶有切換地圖類型的按鈕的控制項。
GMenuMapTypeControl() 帶有切換地圖類型的下拉式的控制項。

‧地圖類型

在地圖類型切換控制項會出現那些地圖類型，是依據此地圖中註冊了那些地圖類型，預設已註冊 G_NORMAL_MAP、G_SATELLITE_MAP、G_HYBRID_MAP 等三個地圖類型，地圖類型顯示預設為 G_NORMAL_MAP，這裡可以透過幾個方法來做更改。
<br />var myMap = new GMap2(document.getElementById("my_map"));<br />myMap.setCenter(new GLatLng(25.08532, 121.561498), 11);<br />myMap.addControl(new GMapTypeControl());<br /> <br />myMap.getMapTypes().length = 0;<br />myMap.addMapType( G_NORMAL_MAP );<br />myMap.addMapType( G_PHYSICAL_MAP );<br /> <br />myMap.setMapType( G_PHYSICAL_MAP );<br />
看範例所呈現的結果

在這個範例中更改了地圖類型註冊為 G_NORMAL_MAP、G_PHYSICAL_MAP，並將地圖類型顯示更改為 G_PHYSICAL_MAP。

GMap2.getMapTypes() 取得地圖中註冊的地圖類型陣列，這裡我用了偷雞的方法直接用 myMap.getMapTypes().length = 0; 將這個陣列長度設為 0，先將預設已註冊的三個地圖類型清除。

GMap2.addMapType( type ) 新增地圖類型，type 必須為已知的地圖類型 GMapType。

GMap2.setMapType( type ) 設定顯示的地圖類型，type 必須為已知的地圖類型 GMapType。

如果要將已註冊的地圖類型移除可以使用 GMap2.removeMapType( type ) ，所以上個範例也可以這樣做，如下。
<br />var myMap = new GMap2(document.getElementById("my_map"));<br />myMap.setCenter(new GLatLng(25.08532, 121.561498), 11);<br />myMap.addControl(new GMapTypeControl());<br /> <br />myMap.removeMapType( G_SATELLITE_MAP );<br />myMap.removeMapType( G_HYBRID_MAP );<br />myMap.addMapType( G_NORMAL_MAP );<br />myMap.addMapType( G_PHYSICAL_MAP );<br /> <br />myMap.setMapType( G_PHYSICAL_MAP );<br />
可使用的地圖類型如下︰

G_NORMAL_MAP 地圖
G_SATELLITE_MAP 衛星
G_HYBRID_MAP 混合
G_PHYSICAL_MAP 地形

除了 Google Maps 所提供的四種地圖類型之外，Google Maps API 也允許使用者建立自己的地圖類型，這部份在往後會再做詳盡的說明。

參考︰
‧class GMap2︰addControl(control, position?)，removeControl(control)
‧class GControl
‧class GMap2︰getMapTypes()，setMapType(type)，addMapType(type)，removeMapType(type)
‧class GMapType


更多教學文件在此︰Google Maps API - 前言及目錄