Google Maps API - 自定地圖類型

之前在『新增地圖控制項、地圖類型』一篇中已介紹過關於地圖類型的設定，以及可以使用的地圖類型（G_NORMAL_MAP 地圖、G_SATELLITE_MAP 衛星、G_HYBRID_MAP 混合、G_PHYSICAL_MAP 地形）。在 Google Maps API 也可以定義自己的地圖類型，並開發全新的顯示樣式。

可以透過 GTileLayer 建構圖塊疊加層， GMapType 建構新的地圖類型，並使用 GMap2.addMapType() 方法將其添加到地圖。

<br />//設定版權訊息<br />var myCopyright = new GCopyrightCollection("Lazy Worm's Island ");<br />myCopyright.addCopyright(new GCopyright('Ian Jung',<br /> new GLatLngBounds(new GLatLng(-90,-180), new GLatLng(90,180)),<br /> 0,'©2009 Ian Jung')); <br />//建構圖塊疊加層<br />var myTileLayer = new GTileLayer(myCopyright, 0, 2, { tileUrlTemplate: 'ij-map-{Z}-{X}-{Y}.png', <br /> isPng:true,<br /> opacity:1.0<br /> });<br />//建構新的地圖類型<br />var IJ_LAZYWORM_ISLAND_MAP = new GMapType([myTileLayer],<br /> new GMercatorProjection(23), <br /> "Island", <br /> { shortName: "IJ_Island", alt: "顯示 Lazy Worm's Island" });<br /><br /><br />var myMap = new GMap2(document.getElementById("my_map"));<br />myMap.setCenter(new GLatLng(0, 0), 1);<br /><br />myMap.getMapTypes().length = 0;<br />myMap.addMapType( G_NORMAL_MAP );<br />myMap.addMapType( IJ_LAZYWORM_ISLAND_MAP );<br />myMap.setMapType( IJ_LAZYWORM_ISLAND_MAP );<br /><br />myMap.addControl(new GLargeMapControl());<br />myMap.addControl(new GMapTypeControl());<br />
看範例所呈現的結果

1. 設定版權訊息

地圖通常包含從一些外部機構購買、生成或許可的圖片。這些圖片通常需要顯示版權訊息，在某些情況下（例如衛星數據），地圖上不同位置的圖片可能來自不同的來源。為了在自定地圖類型上顯示動態版權訊息，Google Maps API 提供了大量對象來存放版權訊息，並提供了基於當前視窗和縮放級別對此版權訊息實現檢索的方法和接口。

GCopyrightCollection(prefix?:String)︰管理自定義地圖類型的地圖上顯示的版權訊息。
GCopyright(id:Number, bounds:GLatLngBounds, minZoom:Number, text:String)︰版權對象包含以下訊息：哪個版權訊息適用於指定縮放級別的矩形地圖地區。

設定版權訊息詳細說明

2. 建構地圖圖塊層

GTileLayer(copyrights:GCopyrightCollection, minResolution:Number, maxResolution:Number, options?:GTileLayerOptions)︰您可以實現此接口，以透過 GMapType 或 GTileLayerOverlay 提供自定的地圖圖塊層。此接口的實現應使用 GTileLayer 實例作為原型，因為這樣可以為您實現版權處理。

在 GTileLayerOptions 物件中的的 tileUrlTemplate 屬性，是指定圖塊網址模板，該模板可以針對每個圖塊請求而展開，以根據現有的圖塊坐標引用唯一的圖塊。將模板置於 GTileLayer 構造函數中可允許您使用此坐標系動態檢索圖塊，檢索方式類似於 Google 地圖檢索圖塊的方式。模板的格式應該為︰
http://host/ij-map-{Z}-{X}-{Y}.png
，其中 X 和 Y 分別指緯度和經度圖塊坐標，Z 指縮放級別，比如 http://host/ij-map-2-3-1.png。

圖塊坐標


Google 地圖坐標，圖塊製作詳細說明

3. 建構新的地圖類型

GMapType(layers:GTileLayer[], projection:GProjection, name:String, opts?:GMapTypeOptions)︰實現自己的自定地圖類型。要在地圖中顯示地圖類型，請使用 GMap2.addMapType() 方法。

參考︰
‧class GCopyrightCollection
‧class GCopyright
‧class GTileLayer
‧GTileLayerOptions
‧class GMapType
‧GMapTypeOptions

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