1. Add this function into extension EGMap.php
public function addAutocomplete($inputId = null) { if ($inputId === null) $autocomplete = new EGMapAutocomplete(); else $autocomplete = new EGMapAutocomplete($inputId); $this->resources->add('autocomplete', new CTypedList('EGMapAutocomplete')); $this->resources->itemAt('autocomplete')->add($autocomplete); } 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; }2. Create New file EGMapAutocomplete.php
class EGMapAutocomplete extends EGMapBase { //String $url url of image protected $inputId; protected $marker_object = 'google.maps.places.Autocomplete'; const GMAP_LIBRARY = 'http://maps.googleapis.com/maps/api/js?libraries=places&sensor=false'; public function __construct( $inputId = 'searchTextField',$js_name = 'autocomplete') { $this->inputId = $inputId; $this->setJsName($js_name); } /** * * @return inputId */ public function getInputId() { return $this->inputId; } /** * * @return string js code to create the autoComplete */ public function toJs($map_js_name = 'map') { $this->options['map'] = $map_js_name; $return = "var input = document.getElementById('".EGMap::encode($this->inputId)."');". PHP_EOL; $return .= $this->getJsName() . ' = new ' . $this->marker_object . '(input);' . PHP_EOL; $return .= $this->getJsName().".bindTo('bounds', ".$map_js_name.");" . PHP_EOL; $event = new EGMapEvent('place_changed', "function() { ".$map_js_name."_info_window.close(); var place = autocomplete.getPlace(); if (place.geometry.viewport) { ".$map_js_name.".fitBounds(place.geometry.viewport); } else { ".$map_js_name.".setCenter(place.geometry.location); ".$map_js_name.".setZoom(17); } ".$map_js_name."_marker.setPosition(place.geometry.location); var address = ''; if (place.address_components) { address = [(place.address_components[0] && place.address_components[0].short_name || ''), (place.address_components[1] && place.address_components[1].short_name || ''), (place.address_components[2] && place.address_components[2].short_name || '') ].join(' '); } ".$map_js_name."_info_window.setContent('3. Add $params .= '&libraries=places'; this into registerMapScript function before CGoogleApi::init();' + place.name + '' + address); ".$map_js_name."_info_window.open(map, marker); }",false); $return .= $event->getEventJs($this->getJsName()) . PHP_EOL; return $return; } }
4. Add $init_events[] = $this->getAutocompleteJs(); into registerMapScript function bellow $init_events[] array.
Yii::import('ext.EGMap.*'); $gMap = new EGMap(); $gMap->setJsName('map'); $gMap->setWidth(827); $gMap->setHeight(400); $gMap->zoom = 6; $gMap->addAutocomplete(); $mapTypeControlOptions = array( 'position' => EGMapControlPosition::RIGHT_TOP, 'style' => EGMap::MAPTYPECONTROL_STYLE_HORIZONTAL_BAR ); $gMap->mapTypeId = EGMap::TYPE_ROADMAP; $gMap->mapTypeControlOptions = $mapTypeControlOptions; $icon = new EGMapMarkerImage("http://google-maps-icons.googlecode.com/files/workoffice.png"); $icon->setSize(32, 37); $icon->setAnchor(16, 16.5); $icon->setOrigin(0, 0); $count = $dataProvider->getTotalItemCount(); if ($count > 0) { $i = 0; foreach($dataProvider->getData() as $record) { $marker[$i] = new EGMapMarker($record->lat, $record->lng, array('title' => Yii::t('catalog', $record->nama), 'icon'=>$icon, 'draggable'=>false), 'marker', array()); $info_window_m[$i] = new EGMapInfoWindow(''.$record->nama.''); $marker[$i]->addHtmlInfoWindow($info_window_m[$i]); $gMap->addMarker($marker[$i]); $i++; } $gMap->setCenter($marker[0]->lat, $marker[0]->lng); $gMap->zoom = 12; } else { $gMap->setCenter(23.716564, 90.402359); } $gMap->renderMap(array(), Yii::app()->language);
No comments:
Post a Comment