php - Loading screen for Google Maps - Stack Overflow

admin管理员组

文章数量:1356135

I've noticed that Google Maps is taking longer than usual to load these days, and causes the browser to refresh many times before loading. Either way, this has led me to wonder how I can create a loading screen to display before the map fully loads.

Any suggestions?

Update: (In response to Gabi's code)

google.maps.event.addListener(map, 'tilesloaded', function(){
    document.getElementById('loading').innerHTML = '';
})

Is it possible to have a loading PNG overlay the entire map and remove it just before the tilesloaded event?

I've noticed that Google Maps is taking longer than usual to load these days, and causes the browser to refresh many times before loading. Either way, this has led me to wonder how I can create a loading screen to display before the map fully loads.

Any suggestions?

Update: (In response to Gabi's code)

google.maps.event.addListener(map, 'tilesloaded', function(){
    document.getElementById('loading').innerHTML = '';
})

Is it possible to have a loading PNG overlay the entire map and remove it just before the tilesloaded event?

• php
• javascript
• google-maps
• google-maps-api-3

Share Improve this question Follow edited Jul 20, 2012 at 9:38 Tony 10.4k33 gold badges5050 silver badges7777 bronze badges asked Jun 28, 2011 at 6:32 NyxynyxNyxynyx 63.8k163163 gold badges507507 silver badges856856 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 6

You can listen to the tilesloaded event:

google.maps.event.addListener(map, 'tilesloaded', function(){
    document.getElementById('loading').innerHTML = '';
})

Here is a working jsfiddle: http://jsfiddle/96WgM/2/

Alternatively, you could just set a loading gif image as the map div background:

http://jsfiddle/c962U/

本文标签： phpLoading screen for Google MapsStack Overflow