Google Maps API Geolocation API

Google Map標記叢集與取得使用者位置

李宗霖 2017/11/28 18:35:43
1272

Google Map標記叢集與取得使用者位置


簡介

如何在Map上建立標記叢集與取得使用者目前位置

作者

李宗霖


Google Map標記叢集與取得使用者位置

1. 標記叢集 ( marker cluster )

要使用標記叢集,首先必須要先加入markerclusterer.js、有map以及插入標記,這部分版上有文章教學過,故不再詳述,僅補充該篇未提及的部分。

 
使用叢集後畫面呈現如下
 



2. 取得使用者位置

取得使用者的位置使用的是Geolocation API,首先需要有Https才可以。

Geolocation API 實作於 window.navigator 物件中,使用前要先確認瀏覽器是否支援可用下列方法

Geolocation只有三個function, 分別為 getCurrentPosition()、 watchPosition() 和clearWatch() 。

getCurrentPosition()、 watchPosition()  皆是 用來取得位置資訊, getCurrentPosition() 只取一次,  watchPosition() 則是持續取得所在位置; 而 clearWatch() 是用來停止 watchPosition()。
getCurrentPosition()、 watchPosition()  的參數是一樣的,必要的 successCallback (API會給 Position 物件 ) 與非必要的 errorCallback  ( API會給 PositionError  物件 ),範例如下

PositionError 裡code屬性有四個值,分別表示:


  • 0 : 原因不明的錯誤
  • 1 : PERMISSION_DENIED - 沒有獲取地理位置信息的權限。
  • 2 : POSITION_UNAVAILABLE - 至少有一個地理位置信息內的資訊回傳了錯誤 ( 無法取得位置 )。
  • 3 : TIMEOUT - 取得地理資訊超過時限


Position裡的 coords有API取得的座標位置,取得座標後在 successCallback 中 將地圖中心移至該處,使用範例如下

李宗霖