2016 大庄媽 GPS 系統 大庄媽組南下北港進香的活動今年也特別的加入了 GPS 定位的功能,而這次協同開發的夥伴是大庄媽交流協會的楊協達先生,但其實架構與白沙屯南下進香的 GPS系統略有所不同! 這個專案我主要協助製作 HTML、JavaScript、CSS 的撰寫,其中包含了版型、Google Maps JavaScript API 的串接,專案這次使用 G…

2016 大庄媽 GPS 系統

大庄媽組南下北港進香的活動今年也特別的加入了 GPS 定位的功能,而這次協同開發的夥伴是大庄媽交流協會的楊協達先生,但其實架構與白沙屯南下進香的 GPS系統略有所不同!

這個專案我主要協助製作 HTML、JavaScript、CSS 的撰寫,其中包含了版型、Google Maps JavaScript API 的串接,專案這次使用 Google 文件 的 Google Sheets JavaScript API 當作路徑的儲存的空間,如此一來流量就不會是問題(關於用 Google 試算表當 API 的方法可以參考此篇)。

使用 JavaScript 去取得 Google 文件上的路徑資訊

而 GPS 訊號端則是使用 楊協達 先生所撰寫的 Android App 來取得每個點的位置,而 App 再使用 Sheets API POST 上去記錄每個點,如此一來 Google 文件上就可以紀錄著所有行經路線。接著前端 JavaScript 在使用 Sheets JavaScript API 去將文件上的資料以 Json 格式取下來,並且做陣列處理。

Google 文件上的路徑紀錄

此方法的好處就是可以不用架設資料庫,並且可以減少 AJAX 的 Request 量的衝擊,活動結束後更可以直接從 Google 文件上面取得活動路線紀錄!

相關參考

2016 北港迎媽祖 - OA Wu's Blog
2016 北港迎媽祖
2016 北港迎媽祖 北港迎媽祖,這是個為我的家鄉的活動製作網站,幾本上是屬於義務性幫忙、沒盈利的非官方服務。每年我都會在 北港農曆三月十九迎媽祖 前數個月開始製作,目前為止這網站我算是不斷自我突破吧!整體從 設計、後端、系統、切版、攝影、上稿,基本上都是我嘗試一個人完成!以下主要分享一下設計、前端、後端以…
2016 六房媽祖過爐 GPS 系統 - OA Wu's Blog
2016 六房媽祖過爐 GPS 系統
2016 六房媽祖過爐 GPS 系統 雲林六房媽一年一度過爐活動今年也與我的 GPS 系統結合,六房媽在幾年前早已經有在做繞境定位,剛好有朋友介紹讓我與神之路關的開發團隊認識,所以這次的六房媽過爐活動就與林啟元先生合作開發,首次與 ASP.NET 後端結合。 此次的合作開發是採用前後端分離的做法,這次協助的部分主要是針對前…
Pokémon Go 補給站地圖 - OA Wu's Blog
Pokémon Go 補給站地圖
Pokémon Go 補給站地圖 這是一個 Pokémon Go 進化後 CP 推測工具,可以快速查詢寶可夢進化後的 CP 範圍值,同時藉由網友互助回報而建立的全台寶可夢巢穴位置,讓大家可以查詢各精靈在台灣的分佈,若大家想要共同編輯巢穴文件可與網站作者聯絡,同時也可以查詢全台灣的補給站、道館的分佈。 若要進一步的查詢各精靈的精準數…
Google Maps 標記叢集 Marker Clustering - OA Wu's Blog
Google Maps 標記叢集 Marker Clustering
Google Maps 標記叢集 Marker Clustering 各位 Google 地圖 玩家都應該有過當 Marker 太多時,視角一拉遠後全部 Marker 擠在一起的困擾吧!沒錯 OA's Marker Clustering 就是要來處理這個困擾!網路上也有很多關於 Marker Clustering 的 Library,但想要比較能夠掌握概況以及視需求去做調整功能,所以刻了一套可以自訂 Mar…
吳政賢個人簡歷OA WuLiveCoding.tw
OA Wu's Blog
開發心得
2016 大庄媽 GPS 系統