星期五, 5月 11, 2007

部落格的Google My Maps產生器 台灣版! 超簡單

在上一篇 Google Maps更新台灣地圖 裡面已經有提到,台灣區的Google Maps已經有了詳細的圖資。而且利用 Google Maps裡面的超強工具:Google My Maps(簡介)(ex:Goston攝影地圖),就可以編輯出很棒的手繪地圖出來。但如果只是附個連結連到Google Maps的頁面,無法嵌入到部落格裡面,總是覺得整合性不夠。而且用Google Maps要找地點,有時候還真是難找....所以Lanma乾脆寫幾個小工具,讓各位方便定位,以及方便的產生Google My Maps程式碼。許多煩人步驟都被Lanma去除了喔~

優點:
嵌入式Google My Maps與部落格或網頁整合性高,當來源My Maps更新時,網頁內之Maps也隨之更新。
##CONTINUE##
簡單範例:
下面這個Map[原始連結在此]說明,開車怎麼從土城交流道到土城大潤發。


原始圖:

簡易說明
工具分成兩個:
1. U2G:將UrMap的位置與大小導入Google Maps (UrMap to Google Maps)
2. 產生器:產生Google My Maps的iframe Html Code.

步驟如下
0.加工具:把這個連結:U2G用滑鼠左鍵"拖曳"到IE的"連結列"或FireFox的"個人書籤列"(就是出現在瀏覽器工具列的書籤..有點難形容 :P ..)

1.找地點:先到UrmapYam天空活地圖等站,輸入地址或關鍵字,搜尋到相關位置之後,按下剛加入的"U2G"書籤,瀏覽器自動就會讓網頁移至Google Maps並置於正確的位置與大小。如果你想直接用Google Maps找地點的話,可以忽略這個步驟。

2.編My Maps:按下"My Maps" Tab,利用裡面的編輯工具編好你的地圖,按Save存檔,或是開啟以前存檔的Maps。請注意,至少在地圖上拖曳過一次(重要)之後,按下右側"Link to this page"連結,然後複製網址列的內容。

3.產生Code:前往這個產生器網頁,在Link欄位,貼上第二步得到的網址,填入欲產生的寬與高之後,按下"產生Html代碼"按鈕,看看結果是否OK。若不滿意則重複這個步驟。滿意了之後,複製<iframe..這段Code,貼到你的部落格或網頁之後,就大功告成啦~