百度地圖(tu)(tu)API目(mu)前默認支持兩種地圖(tu)(tu)類型（map type）：普通(tong)圖(tu)(tu)和三(san)維圖(tu)(tu)，它們(men)分別(bie)通(tong)過常量BMAP_NORMAL_MAP和BMAP_PERSPECTIVE_MAP來表(biao)示，在1.2版(ban)本(ben)中(zhong)這兩個常量實(shi)(shi)際上(shang)是(shi)MapType對象的(de)實(shi)(shi)例。當然開(kai)發(fa)者也可以(yi)自(zi)己實(shi)(shi)例化一個MapType從而(er)實(shi)(shi)現一個自(zi)定義的(de)地圖(tu)(tu)。
切圖工具的使用
我們先從切圖工(gong)具(ju)(ju)的使(shi)用(yong)開始(shi)，接著再分析該工(gong)具(ju)(ju)產生的代碼來詳細了(le)解(jie)自定義地圖的方法。切圖工(gong)具(ju)(ju)放在了(le)github上，具(ju)(ju)體地址(zhi)為：//github.com/jiazheng/BaiduMapTileCutter，進入后請(qing)下載(zai)TileCutter.exe：
注(zhu)意(yi)，該工具是基于.NET平臺開發的，所(suo)以要求有.NET Framework 4 以上的版本(ben)。
啟動這個exe后會出現這個界面：
首先我們要做的就(jiu)是選擇(ze)一張圖(tu)片作為地(di)圖(tu)的底圖(tu)（圖(tu)片下載自這(zhe)里）：
點擊下一步后需(xu)要設置輸出(chu)的(de)目(mu)錄，這里我們(men)直接選擇桌面：
繼(ji)續下一步，這里要(yao)設置輸出類(lei)型，我們使用默(mo)認值(zhi)，即圖塊(kuai)和相關(guan)代(dai)碼都由工具(ju)生(sheng)成：
坐標(biao)設置我們使用默認(ren)值，即(ji)圖片(pian)的(de)中心點所在(zai)的(de)位(wei)置。由于我們制(zhi)作的(de)是獨立的(de)地(di)圖類型，所以(yi)中心點設置為0, 0即(ji)可。
級(ji)別范圍(wei)設置(zhi)：我們使用自定(ding)義(yi)，將(jiang)范圍(wei)設置(zhi)為(wei)5到(dao)10級(ji)，原圖(tu)(tu)放置(zhi)在第10級(ji)，這樣(yang)5到(dao)9級(ji)工(gong)具(ju)就會自動縮小圖(tu)(tu)片。建議(yi)原圖(tu)(tu)所(suo)在級(ji)別與最大級(ji)別一致，否則高(gao)于原圖(tu)(tu)所(suo)在級(ji)別的時候圖(tu)(tu)片會發虛（因為(wei)工(gong)具(ju)會將(jiang)圖(tu)(tu)片進行(xing)放大處理）。
設置地圖類型的名(ming)稱：
一切就緒(xu)，最后可以(yi)確認所有的(de)信息(xi)是否正確。然后就可以(yi)點擊“開始(shi)切圖”了。
完成了：
這時我們會發現桌面多了一個index.html和一個tiles文件夾。我們打開index.html會看到結果：
源代碼解析
現在再來看看這個頁面的代碼部分(fen)：
<!DOCTYPE html> <html> <head> <title>自定義地圖類型</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script type="text/javascript" src="//api.map.baidu.com/api?v=1.2"></script> </head> <body> <div id="map" style="width:800px;height:540px"></div> <script type="text/javascript"> var tileLayer = new BMap.TileLayer(); tileLayer.getTilesUrl = function(tileCoord, zoom) { var x = tileCoord.x; var y = tileCoord.y; return 'tiles/' + zoom + '/tile' + x + '_' + y + '.png'; }var MyMap = new BMap.MapType('MyMap', tileLayer, {minZoom: 5, maxZoom: 10});var map = new BMap.Map('map', {mapType: MyMap}); map.addControl(new BMap.NavigationControl()); map.centerAndZoom(new BMap.Point(0, 0), 10);</script> </body> </html>
代碼先創建(jian)了一個TileLayer實(shi)例，它代表一個圖(tu)(tu)(tu)層，接著(zhu)實(shi)現getTilesUrl方(fang)法提供圖(tu)(tu)(tu)片的路徑。getTilesUrl方(fang)法由API在鋪圖(tu)(tu)(tu)的時候進(jin)行調(diao)用，調(diao)用時會(hui)提供圖(tu)(tu)(tu)塊(kuai)編(bian)號和(he)級別(bie)信息，開(kai)發者要做的就是根據圖(tu)(tu)(tu)塊(kuai)編(bian)號和(he)級別(bie)信息返回正確圖(tu)(tu)(tu)片地址（有關坐標和(he)圖(tu)(tu)(tu)塊(kuai)編(bian)號的內容可(ke)以(yi)閱讀此文）。
下(xia)面(mian)代碼創(chuang)建一(yi)個MapType實例，第一(yi)個參數(shu)為(wei)地(di)圖類型(xing)的(de)名(ming)字，第二個參數(shu)為(wei)地(di)圖類型(xing)所對(dui)應的(de)圖層，這里我們(men)直接傳遞之前創(chuang)建的(de)TileLayer實例，后(hou)面(mian)是(shi)一(yi)些(xie)可選的(de)配置參數(shu)，這里指定(ding)了最小級(ji)別和(he)最大級(ji)別。
后(hou)面的代碼(ma)就很簡單了(le)，創建map實例(li)，并通(tong)過(guo)配置參數指(zhi)定地圖類(lei)型為(wei)MyMap。
