PhoneGap / Ionic 1
Imal Perera  

PhoneGap getting Current Geo Location

Spread the love

Phone gap is a wonderful platform to build cross platform mobile applications. By  mixing it with  Jquery mobile or Sencha touch frameworks allows you to build user friendly, high quality, amazing applications  🙂

Phone gap documentation is also quite clear to understand. other than setting up phonegap, everything else is easy. i’ll be explaining how to properly get the current geo location using phonegap api. reason is documentation example needs few modifications to get it working.

below is the documentation example.

var onSuccess = function(position) {
    alert('Latitude: '          + position.coords.latitude          + '\n' +
          'Longitude: '         + position.coords.longitude         + '\n' +
          'Altitude: '          + position.coords.altitude          + '\n' +
          'Accuracy: '          + position.coords.accuracy          + '\n' +
          'Altitude Accuracy: ' + position.coords.altitudeAccuracy  + '\n' +
          'Heading: '           + position.coords.heading           + '\n' +
          'Speed: '             + position.coords.speed             + '\n' +
          'Timestamp: '         + new Date(position.timestamp)      + '\n');
};

// onError Callback receives a PositionError object
function onError(error) {
    alert("Please Turn on Geo Location service");
}

navigator.geolocation.getCurrentPosition(onSuccess, onError);

But if you have tried this example it actually does not work.  the reason is getCurrentPosition function is an asynchronous function and it takes some time to return the geo data, most often this function do not return data on time, which means time to return geo data will exceed the default timeout so you wan’t see anything coming out from the above function.

to fix this problem we can set a third parameter for navigator.geolocation.getCurrentPosition() which will be the new configuration,  by increasing timeout to a considerable amount like 60 seconds and also increasing “maximumAge” which indicate the boundary for using a cached position. so any position cached within the value of “maximumAge” will be used without calculating a new position.

var config = {
       enableHighAccuracy: true,
       timeout: 60000,
       maximumAge: 300000
    }

so the practical working code for getting geo location is.

var onSuccess = function(position) {
    alert('Latitude: '          + position.coords.latitude          + '\n' +
          'Longitude: '         + position.coords.longitude         + '\n' +
          'Altitude: '          + position.coords.altitude          + '\n' +
          'Accuracy: '          + position.coords.accuracy          + '\n' +
          'Altitude Accuracy: ' + position.coords.altitudeAccuracy  + '\n' +
          'Heading: '           + position.coords.heading           + '\n' +
          'Speed: '             + position.coords.speed             + '\n' +
          'Timestamp: '         + new Date(position.timestamp)      + '\n');
};

// onError Callback receives a PositionError object
function onError(error) {
    alert("Please Turn on Geo Location service");
}

var config = {
       enableHighAccuracy: true,
       timeout: 60000,
       maximumAge: 300000
    }

navigator.geolocation.getCurrentPosition(onSuccess, onError, config);

Leave A Comment