Fixed and improved asynchronous loading

[mikeschutz]

I made the following changes to get this working in AJAX requests. It works great now -- I hope you can pull these changes into the project.

1. Added $loadAsynchDelay config variable to help prevent issue where maps initialize before its elements finish loading.
2. Moved google.maps.InfoWindow constructor inside loadScript function, so it doesn't error out on asynchronous pages.
3. Added code (line 2117) to prevent Google Maps API from loading multiple times on subsequent AJAX calls.
4. Minor fix on line 2127 to kick off loadScript function on AJAX calls.

Thanks,
Mike

[cristoj]

Hi mike, i try to do it but was impossible: the console say me when i click a button in order to load a map by ajax:

Uncaught ReferenceError: google is not defined
Failed to execute 'write' on 'Document': It isn't possible to write into a document from an asynchronously-loaded external script unless it is explicitly opened.

Do you have any idea, you have a example working?? I don´t know what i am doing wrong....

[mikeschutz]

cristoj,

Here is the code that I am currently using with my pull request code. Note that I use an internal id variable to compensate for the fact that multiple maps may load depending on which tabs are open in my interface.

In the controller:

           // Prepare maps for location lookup:
           $this->load->library('googlemaps');
           $config['loadAsynchronously'] = TRUE;
           $config['map_name'] = 'map_'.$id;        // Need to specify names in case multiple tabs open
           $config['map_div_id'] = 'map_canvas_'.$id; 
           $config['zoom'] = 'auto';
           $config['places'] = TRUE;
           $config['placesAutocompleteInputID'] = 'coord_search_box';
           $config['placesAutocompleteBoundsMap'] = TRUE;  // set results biased towards the maps viewport
           $config['placesAutocompleteOnChange'] = 'map_'.$id.'.setCenter(this.getPlace().geometry.location);';
           $config['center'] = $data['agency']->agency_lat . ', ' . $data['agency']->agency_lon;
           $config['ondblclick'] = 'createMarker_map_'.$id.'({ map: map_'.$id.', position:event.latLng }); set_coords_'.$id.'(event.latLng.lat(), event.latLng.lng());';  // set coordinate fields with new marker location when double-clicked
           $this->googlemaps->initialize($config);
           $this->benchmark->mark('map_initialized');

           // Add markers to map:
           // (trimmed)
           $this->benchmark->mark('map_marked');

           $data['map'] = $this->googlemaps->create_map();
           $this->benchmark->mark('maps_loaded');

In the view:

                        <?php echo $map['js']; ?>
                        <?php echo $map['html']; ?>

Hope that helps...
mike

[cristoj]

Now works perfect, thanks a lot!!

[cristoj]

Hi, i was testing it and i had to change in line 1198-1199 the iw_map variable to global one, because when i click the marker to show the infowindow, the console says me that this var is not defined, and now works fine

[powehuda]

thanks alot this library very coolll

[klaimir]

Hey guys,

BIOSTALL, you should merge this commit into master. Yesterday, i tested this change in my code and this worked nicely but i was searching the solution in Internet because i thought this problem was resolved and merged in master. You loadAsynchronously option doesn´t work, it´s not cool BIOSTALL.

So, thank you very much¡

[navotera]

bro thank for your code.. it works now