user382738
user382738

Reputation: 787

Google Maps API and Head JS problem

So, i'm loading Google Maps APL v3 using headjs, and after that, the gmap3 jQuery plugin. This is the actual code:

head.js( "http://localhost/wordpress/wp-includes/js/l10n.js?20101110", "http://localhost/wordpress/wp-includes/js/jquery/jquery.js?1.4.4", "http://maps.google.com/maps/api/js?sensor=false", "http://localhost/wordpress/wp-content/themes/twentyten/framework/js/gmap3.min.js?3.3" );

The problem is that I get an error that says google.maps.Map is not defined. I think it's because the maps js file loads additional resources, but head js keeps parsing the js files, so we get an error. Any solutions to get around this? Does Google Maps provide a similar google.maps.ready event?

I also tried using "Asynchronously Loading the Javascript API" as documentation says, I copied the whole thing and I get "Uncaught TypeError: Object [object DOMWindow] has no method 'initialize'" error. Weird, weird.

Upvotes: 1

Views: 1442

Answers (1)

Gaucho
Gaucho

Reputation: 51

I'm not sure about the first part, but I am loading it asynchronously and got the same error as you which landed me here on a google search. So for future googlers...

The example google maps API line has this:

script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=initialize";

the "initialize" part is a callback that the code calls once the script loads... so you either need to define an "initialize" function, or change the name to the function you want called and then you should be good to go.

Upvotes: 5

Related Questions