Question

I am using the Google Maps API. I get the Google Map by:

$map = $this->ci->gis->draw_map_position_by_lat_long($this->ci->profile_data['LocLat'],$this->ci->profile_data['LocLong']);
$this->ci->widgets['map']= $map;

Function:

public function draw_map_position_by_lat_long($lat = NULL , $long = NULL) {

    $load['center'] = $lat . ',' . $long;
    $load['map_height'] = "191px";
    $this->ci->googlemaps->initialize($load);
    $i = 0;
    $marker = array();

    $marker['position'] = $lat . ',' . $long;
    $marker['draggable'] = 'TRUE';
    $marker['ondragend'] = "dragmarker(this.getPosition().lat(),this.getPosition().lng())";
    $this->ci->googlemaps->add_marker($marker);

    $map = $this->ci->googlemaps->create_map();
    $this->position_data = array('map' => $map);
    return $this->position_data;
}

The map is every place in my app without any problem except one place.
The strange thing is when I print the map on server side in it is not shown.

        $map = $this->ci->gis->draw_map_position_by_lat_long($this->ci->profile_data['LocLat'],$this->ci->profile_data['LocLong']);
        $this->ci->widgets['map']= $map; 

pre($map);

like this:

I checked in Firebug and no java-script errors.

Another strange thing I found is that when I remove one of my javascript files, the map loads perfectly, but it has no direct link with the Google Map. Also no javascript errors shown in Firebug.

That script is:

jQuery(document).ready(function(){
        jQuery('#photo-slider').bxSlider();


        window.onload = createUploader;     
});

I have no idea what is wrong, I am stuck here. Any suggestion will be appreciated. Thanks

Answer 1

The script is hogging the load event, which can have the effect that the google map can’t use it. If you use the jQuery events instead of DOM events, several scripts can use the event.

Try changing this:

jQuery(document).ready(function(){
        jQuery('#photo-slider').bxSlider();


        window.onload = createUploader;     
});

to:

jQuery(document)
.ready(function(){ jQuery('#photo-slider').bxSlider(); })
.load(createUploader);