I’ve this script to initialize google map.The initialize function initializes the map.The question is that it works but not for the first time when page opens.I’ve to refresh it two to three times for the map to show up.Why this is so?
The initialize function is being called on the body OnLoad event.
and also it is not loading in any other browser except chrome (after two to three page refreshes)
var infowindow = new google.maps.InfoWindow();
var places=[]; //contains the addresses of markers
//Find User GeoLocation to Show On Map for the First TIme Map opens.
if (navigator.geolocation)
{
navigator.geolocation.getCurrentPosition(showPosition)
}
else
{
alert("Geolocation is not supported by this browser.");
}
function showPosition(position)
{
latitude=position.coords.latitude;
longitude= position.coords.longitude;
}
//Initialize Google Map Api
function initialize()
{
geocoder = new google.maps.Geocoder();
//Initial Map Variables
var myoptions={
zoom:8,
center:new google.maps.LatLng(latitude,longitude),
mapTypeId:google.maps.MapTypeId.ROADMAP
};
//Initialize Map
map=new google.maps.Map(document.getElementById("map_canvas"),myoptions);
});
}
I say it’s because it’s unknown when the geolocation returns. It is asynchronous. If the map tries to load before the geolocation finishes, the variables
latitudeandlongitudeare not set and the map won’t load.Make sure the geolocation goes first and it should be fine.
https://files.nyu.edu/hc742/public/googlemaps/stackload.html
HTML: