i'm working on trying trigger event (to unhide alert or image) based on gps coordinates falling within range.
i think need like: if gps lat > x (set based on location want them go to) , < y & gps long > z , < a, show (use js change css display: block).
am down right path? i'll post have basics of getting gps coordinates appear. i'm learning go here, appreciated proper structure. thank you.
document.addeventlistener("deviceready", ondeviceready, false); var watchid = null; // device apis available // function ondeviceready() { var options = { timeout: 100000 }; watchid = navigator.geolocation.watchposition(onsuccess, onerror, options); } // onsuccess geolocation // function onsuccess(position) { var element = document.getelementbyid('geolocation'); element.innerhtml = 'latitude: ' + position.coords.latitude + '<br />' + 'longitude: ' + position.coords.longitude + '<br />' + '<hr />' + element.innerhtml; } // onerror callback receives positionerror object // function onerror(error) { alert('code: ' + error.code + '\n' + 'message: ' + error.message + '\n'); } update:
i have gotten point i'm not getting errors, i'm hoping heading based on current location , destination. appreciated. i'm posting current code below:
document.addeventlistener("deviceready", ondeviceready, false); var watchid = null; var gpscoord = null; var destlat = 37.200401 var destlon = 93.278610 function ondeviceready() { var gpsoptions = { timeout: 5000 }; gpscoord = navigator.geolocation.getcurrentposition(gpssuccess, gpserror, gpsoptions); } //gpssuccess // function gpssuccess(position) { var lat = document.getelementbyid('latitude'); var lon = document.getelementbyid('longitude'); lat.innerhtml = 'latitude:' + position.coords.latitude; lon.innerhtml = 'longitude:' + position.coords.longitude; document.getelementbyid('gotolat').innerhtml = 'destination latitude: ' + destlat; document.getelementbyid('gotolon').innerhtml = 'destination longitude: ' + destlon; } function gpserror(error) { alert('code: ' + error.code + '\n' + 'message: ' + error.message + '\n'); } <div class="container"> <br/> <br/> <p id="latitude">watching latitude...</p> <p id="longitude">watching longitude...</p> <br/> <p id="gotolat">destination latitude...</p> <p id="gotolon">destination longitude...</p> </div>
yeah looks fine. watcher call onsuccess when gps has been polled, , returns data.
i save longitude , latitude in global scope, , can perform ever kind of logic want on it.
