无法在Google Maps脚本标记中使用回调

Question

Building the Google Maps script tag like this to be appended after the div has been rendered and then calling initialize which initializes the map like this fails because I have wrapped my code in an anonymous immediately invoked function expression...

(function(){
    var map,infoWindow;
   //lots of stuff...helper functions to initialize
   var initialize=function()
   {
       //init the map and infoWindow and other stuff here
       //manipulate the DOM here...
       //add controls that draw shapes on the map here...
   };

   var loadScript=function()
   var script=document.createElement('script');
   script.type='text/javascript';
   //cannot call initialize...
   script.src='http://maps.googleapis.com/maps/api/js?v=3.exp&key=API_KEY&sensor=true&'+'libraries=geometry&'+'callback=initialize';
   document.body.appendChild(script);
    };
    $("map-canvas").ready(loadScript);
})();

I get the error saying that the global object initialize could not be found.I would rather not unwrap initialize because it interacts directly with the map and infoWindow variables on many occassions.

UPDATE:

I have also tried to use the following code:

var res=(function(){
    var map,infoWindow;
   //lots of stuff...helper functions to initialize
   var initialize=function()
   {
       //init the map and infoWindow and other stuff here
       //manipulate the DOM here...
       //add controls that draw shapes on the map here...
   };

   var loadScript=function()
   var script=document.createElement('script');
   script.type='text/javascript';
   //cannot call initialize...
   script.src='http://maps.googleapis.com/maps/api/js?v=3.exp&key=API_KEY&sensor=true&'+'libraries=geometry&'+'callback=initialize';
   document.body.appendChild(script);
    };
    return {init:initialize};
})();

var loadScript=function()
{
   var script=document.createElement('script');
   script.type='text/javascript';
   //cannot call initialize...
   script.src='http://maps.googleapis.com/maps/api/js?v=3.exp&key=API_KEY&sensor=true&'+'libraries=geometry&'+'callback='+res.init;
document.body.appendChild(script);//line 509
};
$("map-canvas").ready(loadScript);

Now it says:

 GET http://maps.googleapis.com/maps/api/js?v=3.exp&key=PART_OF_API_KEY%20and%20display%20on%20map...have%20to%20figure%20this%20one%20out...} 
 400  (Bad Request) gmaps.js:509
 loadScript gmaps.js:509
 c jquery-latest.js:3048
 p.fireWith jquery-latest.js:3160
 x.extend.ready jquery-latest.js:433
 q

Answer 1

Regarding to attempt #1:

the scope of variables created in the self-executing function is the function. So when you use the var -keyword this variable will not be visible outside of the function.

Remove the var-keyword, and initialize will be global visible.

attempt #2 can't work, because res.init is an object and not a string.