This is only normally an issue if you have the maps in a tabbed area, accordion, or if the page loads via ajax. If the map starts off hidden the Google Maps API doesn’t know how big the map really is, and can’t figure out how many map tiles to load. Because of this you end up with grey areas showing in the map box.
It is possible to fire an event in javascript to make the map reload the map tiles. Add the following code into your javascript to fire after the map is showing (normally tab or accordion plugins will have a custom event that you need to add this to):
To refresh just one map
(change the 0 in the square brackets to the index of the map on the page).
|
1 |
google.maps.event.trigger(MapListProMaps[0].map, "resize"); |
To trigger a redraw of all maps:
|
1 |
$(document).trigger({type: "resizeMap"}); |
