HighDots Forums  

$(document).ready firing before Google Maps scripts arefully loaded

jQuery jQuery is a fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your web pages. jQuery is designed to change the way that you write JavaScript.


Discuss $(document).ready firing before Google Maps scripts arefully loaded in the jQuery forum.

Reply
 
Thread Tools Display Modes
  #1  
Old   
George V. Reilly
 
Posts: n/a

Default $(document).ready firing before Google Maps scripts arefully loaded - 10-15-2009 , 08:29 PM






About 1 time in 10, I get an error during my $(document).ready
callback because Google Maps' loader hasn't pulled in all of its
JavaScript dependencies yet.

Using Web Developer > View Source > View Generated Source, here's what
the head of my document looks like when I get such an error.

<head>
<script src="http://maps.google.com/maps?
file=api&amp;v=3&amp;sensor=false&amp;key=MY_API_K EY" type="text/
javascript"></script>
+ <script src="http://maps.gstatic.com/intl/en_us/mapfiles/176c/
maps2.api/main.js" type="text/javascript"></script>
<script src="scripts/jquery.js" type="text/javascript"></script>
<script src="scripts/jquery.jmap.js" type="text/javascript"></
script>
<script src="scripts/initialize.js" type="text/javascript"></
script>
</head>

The line starting with + was injected by Google Maps with
document.write. The call to $(document).ready is in initialize.js

jQuery(document).ready(function($){
jQuery('#map1').jmap('init', {'mapCenter':[37.5, -95.7],
'mapZoom': 4}); // CONUS
});

#map1 references an empty div to hold the map. I got jquery.jmap.js
from git://github.com/digitalspaghetti/jmaps.

The error is G_NORMAL_MAP is not defined at line 104 of
jquery.jmap.js, but I think jquery.jmap.js is an innocent victim here.

And here's what the head looks like when everything's loaded before my
$(document).ready callback fires:

<head>
<script src="http://maps.google.com/maps?
file=api&amp;v=3&amp;sensor=false&amp;key=MY_API_K EY" type="text/
javascript"></script>
+ <script src="http://maps.gstatic.com/intl/en_us/mapfiles/176c/
maps2.api/main.js" type="text/javascript"></script>
+ <style type="text/css">@media print{.gmnoprint{display:none}}
@media screen{.gmnoscreen{display:none}}</style>
+ <script src="http://maps.gstatic.com/intl/en_us/mapfiles/176c/
maps2.api/mod_jslinker.js" charset="UTF-8" type="text/javascript"></
script>
<script src="scripts/jquery.js" type="text/javascript"></script>
<script src="scripts/jquery.jmap.js" type="text/javascript"></
script>
<script src="scripts/initialize.js" type="text/javascript"></
script>

+ <script src="http://maps.gstatic.com/cat_js/intl/en_us/mapfiles/
176c/maps2.api/%7Bmod_drag,mod_ctrapi%7D.js" charset="UTF-8"
type="text/javascript"></script>
+ <script src="http://maps.gstatic.com/intl/en_us/mapfiles/176c/
maps2.api/mod_apiiw.js" charset="UTF-8" type="text/javascript"></
script>
+ <script src="http://maps.gstatic.com/intl/en_us/mapfiles/176c/
maps2.api/mod_exdom.js" charset="UTF-8" type="text/javascript"></
script>
</head>

The Net tab in Firebug shows that the extra GMaps scripts have not
been loaded in the failure case.

Any suggestions? Does script injection with document.write play well
with $(document).ready?

This is driving me nuts. Any help appreciated.

/George V. Reilly
Seattle, WA


Reply With Quote
  #2  
Old   
Dave Methvin
 
Posts: n/a

Default Re: $(document).ready firing before Google Maps scripts arefully loaded - 10-15-2009 , 09:49 PM






So all those extra scripts are injected into the head with
document.write? If so they should have definitely been there before
any script below them executed. Have you found the place where Google
Maps is actually doing the document writes for the other scripts? I am
wondering whether it might be adding at least some of the scripts
asynchronously by injecting script tags to the head.

Reply With Quote
  #3  
Old   
George V. Reilly
 
Posts: n/a

Default Re: $(document).ready firing before Google Maps scripts arefully loaded - 10-15-2009 , 10:16 PM



On Oct 15, 6:49*pm, Dave Methvin <dave.meth... (AT) gmail (DOT) com> wrote:
Quote:
So all those extra scripts are injected into the head with
document.write? If so they should have definitely been there before
any script below them executed. Have you found the place where Google
Maps is actually doing the document writes for the other scripts? I am
wondering whether it might be adding at least some of the scripts
asynchronously by injecting script tags to the head.
The first injected script (main.js) is definitely injected with
document.write. I haven't looked to see how the other one's are
injected, but given that they appear at the end of head after the
explicit script blocks, it suggests that there might be some
appendChild games going on.

/George

Reply With Quote
  #4  
Old   
George V. Reilly
 
Posts: n/a

Default Re: $(document).ready firing before Google Maps scripts arefully loaded - 10-16-2009 , 04:47 PM



Over in http://groups.google.com/group/google-maps-api/, I got a
suggestion that seems to work consistently: use Google's Ajax loader
to load the Maps API code asynchronously.

<script type="text/javascript" src="http://www.google.com/jsapi?
key=MY_API_KEY"></script>
<script type="text/javascript">
google.load('maps', "2.x", {other_params:"sensor=false"});
google.setOnLoadCallback(function() { /* My initialization
code */ });
</script>

/George

Reply With Quote
  #5  
Old   
George V. Reilly
 
Posts: n/a

Default Re: $(document).ready firing before Google Maps scripts arefully loaded - 10-16-2009 , 04:59 PM



And here's a pared-down repro of my original problem:
http://www.georgevreilly.com/temp/loaddemo.html

Be warned. It reproes maybe one time in 50 with this code. Seems to
happen more if the browser has been idle for a while.

/George

Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.