在Google地圖中建立自己的影像圖層

詳細的API可以參考這篇
http://code.google.com/intl/zh-TW/apis/maps/documentation/overlays.html#Tile_Layer_Overlays。以下就使用API文件中的程式碼稍加修改來說明。

此文章的目的是要建立一個自訂的地圖，可以在Google Map API中切換。說明直接加在程式碼中。

//建立圖層版權說明
var myCopyright = new GCopyrightCollection("© ");
myCopyright.addCopyright(new GCopyright('Demo',
  new GLatLngBounds(new GLatLng(-90, -180), new GLatLng(90, 180)),
  0, '© Your Name')); 
  
//建立新圖層(使用Google SATELLITE為底圖再加上自建的Tile圖層)
my_tileLayers = [G_SATELLITE_MAP.getTileLayers()[0], new GTileLayer(mycopyright, 1, 10)];

//設定自建的Tile圖層的Tile取得方式
my_tileLayers[1].getTileUrl = function(tile, zoom) {

    //zoom值順序與Google的相反//圖層僅有自訂的1至10層，所以也只處理1~10層
    zoom1 = 17 - zoom;

    //僅在特定圖層才回傳Tiles
    if (zoom1 >= 1 && zoom1 <= 10) {
        return "http://yoursite.com/dir/" + zoom1 + '/' + tile.x + '/' + tile.x + '_' + tile.y + '_' + zoom1 + ".jpg";
    } else { return ""; }
}

//告訴google這圖層的Tile圖片格式不是PNG
my_tileLayers[1].isPng = function() { return false; };

//設定此圖層的透明度為100%不透明
my_tileLayers[1].getOpacity = function() { return 1; }; //建立自訂地圖
var my_customMap = new GMapType(my_tileLayers, G_HYBRID_MAP.getProjection(), "我的地圖", { maxResolution: 10, minResolution: 1 });

//加入自訂地圖至Google控制介面中
map.addMapType(my_customMap);

//將目前的地圖切換至自訂的地圖
map.setMapType(my_customMap);

以上的程式碼跟Google範例的有點不同，也比較複雜些。但是可以多一些彈性，如圖層的順序與Google預設不一樣，或者有自己取得Tiles的邏輯，都可以用這個程式範例加以修改。