Search code examples
geolocationphonegap-pluginscordova-plugins

Geolocation is giving timeOut error cordova android application


I am using visual studio Cordova tool for creating application. I am uding geolocation of HTML5 for getting user location.

When I execute it in ripple naxus-galaxy, it working fine, but when I run it in android device, it's not working at all. It shows me TimeOut error accured everytime.

I have already installed geoLocation plugin.

My code is,

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>GeoLal</title>

    <!-- GeoLal references -->
    <link href="css/index.css" rel="stylesheet" />
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
</head>
<body>
    <p>Hello, your application is ready!</p>
    <div id="map-canvas" style="position:absolute; width:100%; height:100%"></div>
    <script>


        var map;
        function initialize() {
            if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(showPosition, showError, { timeout: 15000, enableHighAccuracy: true });
            } else {
                alert("Geolocation is not supported by this browser.");
            }
        }

        function showPosition(position) {
            alert("Pos = " + JSON.stringify(position));
            var mapOptions = {
                zoom: 8,
                center: new google.maps.LatLng(position.coords.latitude, position.coords.longitude)
            };
            map = new google.maps.Map(document.getElementById('map-canvas'),
                mapOptions);
        }

        function showError(error) {
            switch (error.code) {
                case error.PERMISSION_DENIED:
                    alert("Please share your location with us to move ahead.");
                    break;
                case error.POSITION_UNAVAILABLE:
                    alert("Location information is not available, Check your internet connection.");
                    break;
                case error.TIMEOUT:
                    alert("The request to get user location timed out.");
                    break;
                case error.UNKNOWN_ERROR:
                    alert("We are not able to fetch your location details.");
                    break;
            }
            initialize();
        }

        google.maps.event.addDomListener(window, 'load', initialize);


    </script>



    <!-- Cordova reference, this is added to your app when it's built. -->
    <script src="cordova.js"></script>
    <script src="scripts/platformOverrides.js"></script>

    <script src="scripts/index.js"></script>
</body>
</html>

And web.config is,

<?xml version="1.0" encoding="utf-8"?>
<widget xmlns:cdv="http://cordova.apache.org/ns/1.0" xmlns:vs="http://schemas.microsoft.com/appx/2014/htmlapps" id="io.cordova.GeoLal" version="1.0.0.0" xmlns="http://www.w3.org/ns/widgets">
  <name>GeoLal</name>
  <description>A blank project that uses Apache Cordova to help you build an app that targets multiple mobile platforms: Android, iOS, Windows, and Windows Phone.</description>
  <author href="http://cordova.io" email="[email protected]">Apache Cordova Team </author>
  <content src="index.html" />
  <access origin="*" />
  <preference name="SplashScreen" value="screen" />
  <preference name="windows-target-version" value="8.0" />
  <preference name="windows-phone-target-version" value="8.1" />
  <vs:plugin name="org.apache.cordova.geolocation" version="0.3.10" />
  <vs:platformSpecificValues />
</widget>

Do I need to change something in web.config file...?


Solution

  • getCurrentPosition() makes a single request for the device position. If this is called immediately after the app starts, the timeout may occur before the GPS hardware on the device has had a chance to get a position fix.

    I'd suggest using watchPosition() instead to setup a watcher which will call the success function each time the OS receives a location update. If you only need a single position, you can clear the watcher once you've got a position of acceptable accuracy.

    For example:

    var minAccuracyInMetres = 50;
    
    var positionWatcher;
    
    function onDeviceReady(){
        positionWatcher = navigator.geolocation.watchPosition(
          geolocationSuccess,
          geolocationError,
          {maximumAge:0, timeout: 15000, enableHighAccuracy: true});
    }
    
    function geolocationSuccess(position){
      // Reject if accuracy is not sufficient
      if(position.coords.accuracy > minAccuracyInMetres){
          return;        
      }
    
      // Only single position required so clear watcher
      navigator.geolocation.clearWatch(positionWatcher);
    
      // Do something with the user's location...
    
    }
    
    document.addEventListener("deviceready", onDeviceReady, false);