Can we get an event for when gmpx-api-loader is done loading?

[spingary]

Can we get an event fired when gmpx-api-loader is done loading "maps" and other libraries? Currently there's no way to implement a "initMap" type function reliably.

For example, on Safari, once the page is cached, the window.load event fires before the Google Maps library is finished loading/initializing. As such, I cannot access google.maps.* functions.

I had to resort to polling (yuck!) for now.

[awmack]

Hey! Thanks for the feedback. Can you give some more description about your use case -- what are you trying to accomplish? In general, I would recommend avoiding the global google.maps object and instead get references to GMP API objects explicitly (for exactly the types of scenarios you mention).

Typically, <gmpx-api-loader> usage falls into two scenarios:

• If you're simply using components in this library like <gmpx-place-overview>, a <gmpx-api-loader> is a way to specify your API key and you don't need to explicitly wait for anything.
• If you're building your own component and want to use <gmpx-api-loader> to load a Google Maps library, you'd write e.g. const { Map } = await APILoader.importLibrary('map');. In this case you wouldn't need an event since you are await'ing the load event in JS.

[spingary]

So I am placing a component with some markers inside. I have a select box which a user can change to show/hide different markers inside the map. On page load, I need to read the default select box selection, and then show/hide the appropriate markers in the map, then do a fitBounds().

As such, I need to use "new google.maps.LatLngBounds()" on page load so I can calculate the bounds to fitBounds to. But as mentioned, sometimes google.maps is not yet initialized, so even though my script runs on window.load,

So in my case, would you suggest that I don' t use the web component and instead load the map programmatically?

Thank you for your help!