geolocation Demo_watchPosition

HTML5의 기능인 geolocation 의 기능중 위치 정보를 계속 조회하는 watchPosition의 기능을 알아보겠다.

아래 버튼을 클릭하면 watchPosition 메서드를 이용하여 위치관련 정보를 조회/종료를 할수 있다.

버튼 클릭시 호출 되는 자바스크립트의 소스는 아래와 같다.
<script type="text/javascript"> var loopCount = 0; //조회수 //위치 정보 확인하기 function showWatchPositionInfo(pos) { try { document.getElementById("divPostionInfo").innerHTML = "<ul class='list'><li>조회 횟수 : " + loopCount++ + "</li><li>timestamp : " + pos.timestamp + "</li><li>latitude : " + pos.coords.latitude + "</li><li>longitude : " + pos.coords.longitude + "</li><li>altitude : " + pos.coords.altitude + "</li><li>accuracy : " + pos.coords.accuracy + "</li><li>altitudeAccuracy : " + pos.coords.altitudeAccuracy + "</li><li>heading : " + pos.coords.heading + "</li><li>speed : " + pos.coords.speed + "</li></ul>"; } catch (ex) { alert(ex.message); } } //에러발생시 호출되는 함수 function handleError(error) { document.getElementById("divPostionInfo").innerHTML = "브라우저가 기능을 지원하지 않습니다."; } var watchId; //위치 추적 시작하기 function startWatchPosition() { if (typeof (navigator.geolocation) == 'undefined') { document.getElementById("divPostionInfo").innerHTML = "브라우저가 기능을 지원하지 않습니다."; } else { watchId = navigator.geolocation.watchPosition(showWatchPositionInfo, handleError); } } //위치추적 종료하기 function stopWatchPosition() { try { navigator.geolocation.clearWatch(watchId); } catch (ex) { alert(ex.message); } } </script>