Search code examples
ioscordovageolocationphonegap-buildonload

how to load Maps after onDeviceReady function in iOS Cordova based app?

I want to Load maps after oDeviceReady function to avoid a Permission alert to access Maps in iOS which shows complete bundle path location as shown below:(iOS Cordova 3.8.0 version)

enter image description here

For this I have used 

   <link rel="stylesheet" href="css/jquery.mobile-1.4.5.min.css" />
   <script src="cordova.js"></script>
  <link href="css/styles.css" rel="stylesheet" type="text/css">
  <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places"></script>
  <script src="js/jquery-1.11.1.min.js"></script>
  <script src="js/jquery.mobile-1.4.5.min.js"></script>
  <script src="js/hashmap.js"></script>

After head tag:

 </head>
 <body onload="onBodyLoad();">//Called onload

After this

  function onBodyLoad()
  {
         document.addEventListener("deviceready", onDeviceReady, false);
  }


   function onDeviceReady(){      
      return navigator.geolocation.getCurrentPosition(initialize);       
     document.addEventListener("backbutton", onBackKeyDown, false);     
    }

  function initialize() 
 {
   geocoder = new google.maps.Geocoder();
   if (navigator.geolocation) 
   {
      navigator.geolocation.getCurrentPosition(function (p) 
      {
      LatLng = new google.maps.LatLng(p.coords.latitude, p.coords.longitude);
      map = new google.maps.Map(document.getElementById("estimate"), mapOptions);
     infowindow = new google.maps.InfoWindow();
     marker =new google.maps.Marker({position:LatLng,map:map});
     getAddress(p.coords.latitude,p.coords.longitude);

    }
  }
}

    //This line is making to display complete Bundle path loaction
    //Where as calling this line to avoid error in onDeviceready, My maps are not loading
    // Suggest me where should I call this line of code to avoid this alert
    google.maps.event.addDomListener(window, 'load', initialize);


    function getAddress(lat, lng)
    {
        //Code to get address
     }

Can anyone suggest me where should I call below line to avoid this type alert;

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

Other than this alert my code is working fine...

Solution

  • Make sure you installed the geolocation plugin with

    cordova plugin add cordova-plugin-geolocation

    and change your code to

    function onBodyLoad() {

    document.addEventListener("deviceready", onDeviceReady, false);

}


function onDeviceReady(){      
    navigator.geolocation.getCurrentPosition(initialize);       
    document.addEventListener("backbutton", onBackKeyDown, false);     
}

function initialize(p) {
    geocoder = new google.maps.Geocoder();

    LatLng = new google.maps.LatLng(p.coords.latitude, p.coords.longitude);
    map = new google.maps.Map(document.getElementById("estimate"), mapOptions);
    infowindow = new google.maps.InfoWindow();
    marker =new google.maps.Marker({position:LatLng,map:map});
    getAddress(p.coords.latitude,p.coords.longitude);
}