essoduke's blog

tinyMap 2.0 jQuery Plugin

Posted by essoduke - 2010 年 09 月 08 日 20:40:18 - 12 User Views

自從研究 Plurk API 失敗後，也剛好 Google Map API Javascript v3 已釋出一段時間，索性這次整個改寫 tinyMap。

tinyMap 2.0 jQuery Plugin

2.0 版的特色：

• 使用 Google Map API v3 改寫
• 加入路徑規劃功能

範例：混合地圖、地點標示

範例：路徑規劃

延伸閱讀：

• tinyMap – 自訂個人Google Map 的jQuery 擴充套件

Google Map 座標工具 v1.1

Posted by essoduke - 2009 年 04 月 05 日 14:50:26 - 1,134 User Views

今天邊玩 Web 棒球的同時，就順手更新了 Google Map 座標工具。

Google Maps 早在 2007 年就已經開放可以搜尋台灣地址，所以 v1.1 主要是加入顯示標記地址的功能，下次預計會加入最基本的搜尋並且可以自訂 JSON 的輸出內容。

這次使用了 Google Maps API Geocoding Service。Geocoding 傳回的是一組包含座標、地址、郵遞區號等資料的 JSON，所以這部份很好處理，比較棘手的是遇到 jQuery selector 抓不到 append 所建立的 li 清單，所以用了 jQuery FlyDOM Plugin 建立 DOM 的方式來解決。

延伸閱讀：

• Google Map 座標工具
• Google地圖 – 維基百科，自由的百科全書

Google Map 座標工具

Posted by essoduke - 2009 年 03 月 19 日 20:44:13 - 2,663 User Views

因為這個案子的需要，所以就做了 Google Map 座標工具，靈感來自於 Interactive Polyline Encoder Utility，但是沒有加入劃線功能，只多了輸出 JSON 的選項。

※支援 Firefox 3/Opera 9.6，IE6/IE7 在拖曳上似乎有問題…

Google Map 座標工具

先點選要標記的位置（可連續點選、拖曳）右側的清單上就會出現該點的座標，也可以點選清單內的座標，左側地圖就會顯示出對應的標記；輸出 JSON 的作用是方便後續的應用，包括存入資料庫…等等。

改天再補上 Google Maps API 的使用心得…

延伸閱讀

• Google Maps
• Google Maps API