When is Google Maps loaded?

Question

I am trying to port my Live Earthquake Mashup at

http://www.oe-files.de/gmaps/eqmashup.html

to Google Maps API v3. At the moment I am struggling to find the right moment when the map and especially custom controls are rendered, so I can load the first data feed. The custom controls need to be shown, because the one representing one of several feeds gets highlighted.

I have read about google.maps.event.addListenerOnce and events "idle" and "tilesLoaded", but none of these seem to work at the moment.

The mashup, as far as I have come, can be found here:

http://www.oe-files.de/gmaps/eqmashup-ng.html

Clicking on one of the feed selectors (bottom right) will load the feeds, once the page is loaded. But I can't seem to find the right moment to call "switchFeed" after loading the page.

A ton of other things are still missing, but at the moment this is the biggest problem. Any help is appreciated.

---

Update:

At the moment, this sequence is supposed to initialize the map and load the first data:

google.maps.event.addDomListener(window, 'load', initMashup);
google.maps.event.addListenerOnce(map, 'tilesLoaded', function() {
        switchFeed('usgs25');
    });

This does not work, because "maps" is not initialized when addListerOnce is executed. The other way I have tried is (more or less)

google.maps.event.addDomListener(window, 'load', initMashup);
switchFeed('usgs25');

which doesn't work either, because switchFeed toggles the style of a button that is added as custom control (via map.controls), and that button is not rendered yet.

So my question is: When is the moment the map is fully loaded, and how can I attach an action to this event?

Answer 1

well I am not sure if I get your problem, it sounds pretty trivial to me, you can load your google maps and control simultaneously, once your feed is loaded you can update your map, now when the user drags the selection, depending on weather you will make a fresh request or will use a preloaded json file you can choose to clear old markers and load new ones ?? If this is not what you are asking maybe editing your question will help me answer you better

Answer 2

Never mind, I found an order of operation so that the page loads. It's not as smooth as with the V2 API, but it works.

There are some other (pure JavaScript) kinks to be fixed, though. I think the transition from V2 to V3 is not as easy as Google wants to make us believe...

Answer 3

There's no reason to wait so long before loading the feed. Simply initialize the map in initMashup() and as soon as you call setCenter() and initialize your controls, the map is ready for further operations. You can call switchFeed() immediately after that, but do in inside the initMashup() function. Your second code sample didn't work because you called switchFeed() before the initialization code executed at all.

Remember that this is asynchronous code; watch out for order of execution. Some well-placed console.log() calls will clarify a lot.