WebMap DIY(定製你自己的網路地圖，GMapImageCutter工具推薦)

自從上次發布了Google Maps API離線開發包以後，就有人來問我，為什麼離線狀態下不能顯示地圖，能否顯示自己的DIY地圖。嚴格來說，這是兩個問題，為什麼不能顯示地圖是因為Google的地圖圖片本身就不在本地，所以離線狀態下是肯定不能顯示地圖的，不過能夠標點畫線等動作下有沒有地圖圖片並不重要，而能否顯示自己的DIY地圖，其實Gmaps API本身就帶了，GOverlay/GTileLayer等函數就是能夠添加自己的圖片，只是我不喜歡只添加一張圖片到Gmap上，覺得意義不大，但又沒有找到好的tile的切割工具，所以這個功能我一直沒有嘗試。今天，我向大家推薦GMapImageCutter工具，一個能夠將圖片切割成tile的工具，並且還幫你產生了HTML檔案，直接就能夠瀏覽，厲害。

其實這個工具最早是在IT168上看到的，我就下載了下來，但一直沒有安裝java環境，所以一直沒有怎麼用，IT168的文章我也沒有怎麼看，但大致知道怎麼一回事，今天安裝了java環境所以就可以跑起來試試看了，用下來感覺非常的好。所以就打包上來和大家分享，除了工具，還帶了我的Google Maps API的離線開發包，還帶了北京師範大學和北京動物園兩個地圖的DEMO，這兩個DEMO只要部署到IIS或者Apache上就可以使用，即使是在離線狀態下。

OK，下面我們就來講講這個工具的使用吧。GMapImageCutter.jar這是該工具，是java的程式，通過命令列方式就能使用：javaw -Xms512M -Xmx1024M -jar gmapimagecutter.jar。當然我們只要運行GMapImageCutter.bat就可以(這裡首先要保證的是你有java的環境，安裝個J2SE)。運行後可以看到如所示的介面(這裡我已經開啟了北京動物園的圖片了)：

該工具自動判斷圖片大小，然後選擇一個縮放層級，當然你也可以自己調節縮放層級，只是對於圖片來說，調高縮放層級，那麼你的圖片就被拉升了，這樣就模糊了，具體看你自己的需求，你也可以把圖片做的非常大然後縮放層級就可以調到非常高。按照這樣的理論，你甚至可以產生Google Map的全部圖片，17個層級的所有圖片，呵呵，這裡當然是玩笑了，雖然工具上可以調到17層級，一是你做不出這麼大的圖片，二是即使做出來切割也不知道要經過多少時間，三是切割出來的檔案會非常的大，存放都是一個問題。OK，說多了。下面你點擊create按鈕，開始就可以切割了，等待完成你會看到在圖片的相同目錄下產生了一個html檔案和一個圖片目錄，調整一下html中Google Map Key為你自己的key，你就發行就緒你自己的地圖了，簡單吧，一個DIY的WEBMAP就此誕生了。

只是我調整了一下html中的代碼，讓其運行在我的離線開發包上，結果也能顯示沒有任何問題，這樣的話你甚至可以脫離線上的Gmaps API，使用我的離線開發包發布你自己的地圖在你自己的伺服器上，所有的一切都是你自己的，並且重要的是還能夠用Gmaps API來開發，比如我在BNE demo map中加入了一個marker點，後面你想做什麼就完全由你自己去想了，畫線畫面添加點位等等等，你都可以自己完成，儼然就是一個自己的比較強大的WEBGIS(強大之處就是支援Gmaps API開發，呵呵)。

壓縮包內檔案說明：
GMapImageCutter1.4：GMapImageCutter工具
DemoPicture：範例圖片，北京師範大學平面圖和北京動物園平面圖
gmap：Google Maps API離線開發包，內附北京師範大學和北京動物園地圖demo

預覽效果：
將gmap目錄拷貝到IIS的主目錄下，在IE或者FireFox瀏覽器地址欄輸入：
http://127.0.0.1/gmap/BNUmap.html
http://127.0.0.1/gmap/BeijingZoo.html
即可瀏覽北京師範大學和北京動物園的demo地圖效果
其中北京師範大學demo地圖進行了簡單的修改，取消了地圖自適應長寬的內容，並增加了一個marker
如果你不想使用Google Maps API離線開發包，只需要將html檔案中調用的maps_my.js替換成你申請的Google Maps API的地址即可

你也可以使用GMapImageCutter切割一下兩張範例圖片試試看效果。

當然，該工具也是有些弊端的，或者說是需要考慮改進的地方的。

首先，有一個層級是圖片的原始大小，而小於該層級則是對圖片的縮小，大於該層級是對圖片的放大，這樣的情況下除了圖片原始大小狀態下保證圖片品質最好外，其餘層級都可能對圖片造成模糊甚至看不清，如何保證每一層級下都是清晰的圖片，這一點需要進一步的考慮，不會做一些不同比例尺的圖片然後再進行切割吧，也許這也算是一種方法吧。

其次，圖片都是從Google Map的最小層級開始的，也就是說這個圖片的座標範圍是緯度方面是南極到北極，經度方面是東經到西經，那如果該圖片本身就是某一經緯度的範圍，比如是30-31/120-121，那麼如果將該圖片貼圖到該經緯度範圍這才是最完美的也是大部分人所需要的，這個問題該如何解決，可能需要進一步的思考。

總的來說GMapImageCutter確實是非常不錯的tile產生工具。

：http://files.cnblogs.com/Tangf/GMapImageCutter_WebMapDemo.rar  (GMapImageCutter工具+範例圖片+DEMO地圖+Google maps API離線開發包)