EGMap 2.0 Google Maps Extension

Thanks for your reply but I think in iframe, google is preventing the loading of the map. and using the resize method and delay, still not working. This is the code the dialog trigger


    

<?php echo CHtml::ajaxButton(_t('Google Map'), '#', array('success'=>"js:function(){ 

        google.maps.event.trigger(map_location, 'resize');

        setTimeout( function() {

          $('#mapdialog').dialog('open').parent().css({position:'fixed'});

        }, 5000 );

       }"), array('class'=>btn)); ?>



Try this




<?php echo CHtml::ajaxButton(_t('Google Map'), '#', array('success'=>"js:function(){ 

       $('#mapdialog').dialog('open').parent().css({position:'fixed'});

        setTimeout( function() {

           google.maps.event.trigger(map_location, 'resize');

        }, 1000 );

       }"), array('class'=>btn)); ?>



You resized the map before the layer was shown, it has to be done after…

Yeah that was wrong hehe now it’s working!

Many Thanks ! great extension with great developer nice!

btw does this extension include autocomplete of places? when searching?

No, it doesnt, but that could be a great addition to the extension… volunteer?

Thanks for your words

Cheers

I would loved to volunteer but im not expert in php

I attached the class I created and include this function in EGMap.php


	

public function addAutocomplete($inputId = null)

{

    Yii::app()->getClientScript()->registerScriptFile('http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places');

    

    if ($inputId === null)

      $autocomplete = new EGMapAutocomplete();

    else

      $autocomplete = new EGMapAutocomplete($inputId);


    $this->resources->add('autocompletes', new CTypedList('EGMapAutocomplete'));    

    $this->resources->itemAt('autocompletes')->add($autocomplete);

}

and this code to activate the autocomplete


$gMap->addAutocomplete();

but the thing is the jscode inside the class is not generating. For sure Im missing something here ehehe so you may wanna look if you have time thanks

here’s my reference from maps places autocomplete http://code.google.com/apis/maps/documentation/javascript/places.html#adding_autocomplete

cheers

Will have a look at it…

It doesn’t write cuz it is not registered… Seems an interesting addition, will look onto the best way to add it to the library. Thanks.

PS: The google maps api is already registered, what we need to add is the ‘libraries=places’ parameter to the insertion, thus, the use of EGMapAutocomplete class maybe not a right way to do it. Will keep you updated.

I added this function




public function getAutocompleteJs()

	{

		$return = '';

		if (null !== $this->resources->itemAt('autocomplete'))

		{

			foreach ($this->resources->itemAt('autocomplete') as $autocomplete)

			{

				$return .= $autocomplete->toJs($this->getJsName());

				$return .= "\n      ";

			}

		}

		return $return;

	}



and this line


$init_events[] = $this->getAutocompleteJs();

in


public function registerMapScript

the jscode of Autocomplete now displays but it says google.maps.places is undefined. is this because you say that its not registered? in the reference of google you only need this


<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;libraries=places"></script>

to run the api and I already have it and it seems that they dont recognize it!?

I used EGMapAutocomplete for them to have an option to used autocomplete or not and just to separate the code from EGMap.php ehehe

hmm ok Ill wait for your update. It’s exciting ehehe.

If you look at the registerMapScript function you will realize that the API script is registered without the ‘libraries’ param (line 488-494 of EGmap.php), add this to $params variable.




$params .= '&libraries=places';



Should work.

Nevertheless, I realized that places could be a great addition to EGMap and autocomplete is just a small thing onto the places functionality. I remember adding it long time a go but I got ‘trap’ by current projects. I will add it as soon as I have time :)

Hey It works! thanks a lot!

there is a little issue … since I rendered it through dialog… I see the “Enter a location” which is generated by the autocomplete api but the dropdown autocomplete is not showing… maybe it’s the same with my previous issue with the map displaying broken on the dialog but already fixed with setTimeOut() and resize, is it the div/css of the dropdown?

thanks again

check the z-index of the layer, i am sure that is the issue…

Yes its the z-index… its below the z-index of the dialog box. thanks again!

cheers

Did anybody ever answer this? I am having the same problem where my ajax update will not show the map.

Thanks for sharing

I read again the thread and it seems that they’re adding multiple cluster on the js itself and not on the extension that you made. In your extension, adding clusterer is possible but you can only add one right?

Is there a way to add multiple clusterer in your extension?

thanks

Hello

I’m trying to make the geocoder position-capturing function, in a dialog window…

But everytime i enable the $marker->capturePosition() it’s showing in the original view instead of in the dialog…

I think it has something to do with the:


if (!in_array('nocallback', $options)){

  $this->addCallback('function(result){captureMarkerPosition(result);}');

}

but i am not familar enough with javascript to figure out how to fix this problem… :confused:

Futhermore i also got the problem that the map is not fully rendering…

I call the dialog with:


<?php echo CHtml::link('<img src="'.Yii::app()->request->baseUrl.'/images/icons/dsa.png" alt="hej" />', '#', array('onclick'=>"{addGeocode(); $('#dialogGeocodepicker').dialog('open');}")); ?>

and then just:


<?php

$this->beginWidget('zii.widgets.jui.CJuiDialog', array( // the dialog

    'id'=>'dialogGeocodepicker',

    'options'=>array(

        'title'=>'Geocode Picker',

        'autoOpen'=>false,

        'modal'=>true,

        'width'=>550,

        'height'=>470,

    ),

)); 


echo $this->renderPartial('_geocodepicker', array('landmark'=>$landmark)); 


$this->endWidget();?>

Would very much appreciate some help on these issues - thank you very much…

And thanks for a nice extension, which i will love as soon as i get these problems fixed, heh… :)

Hi, thanks for adding the autocomplete function.

To use this function just add this files to the EGMap directory inst it?

Basicly how to call $gMap->addAutocomplete(); at view?

As stated in previous posts, you need to call the map resize in order to render properly… cheers

I am just starting to learn this extension which is really nice by the way and I am trying to go through all of the examples that are listed but I am running into a problem with the advanced example that Johnatan has posted. I keep getting an error that says $items is undefined. Does anyone know where this is supposed to be declared or what is is supposed to reference?


$dragevent = new EGMapEvent('dragend', "function (event) { $.ajax({

                                            'type':'POST',

                                            'url':'".$this->createUrl('catalog/savecoords').'/'.$items->id."',

                                            'data'<img src='http://www.yiiframework.com/forum/public/style_emoticons/default/sad.gif' class='bbc_emoticon' alt=':(' />{'lat': event.latLng.lat(), 'lng': event.latLng.lng()}),

                                            'cache':false,

                                        });}", false, EGMapEvent::TYPE_EVENT_DEFAULT);

Also, I know he mentions that $map is model of a database table used to save coordinates but can anyone tell me or show me what exactly this model and database table contain? Thanks

anyone can show me how to use MYSQL inside EGmap?