ngOnInit() {
// TODO: style icon inside autocomplete? https://developers.google.com/maps/documentation/javascript/places-autocomplete
this.mapsAPILoader.load().then(() => {
const autocomplete = new google.maps.places.Autocomplete(this.originInput.nativeElement, {
types: ['address']
});
autocomplete.addListener('place_changed', () => {
// get the place result
const place: google.maps.places.PlaceResult = autocomplete.getPlace();
// verify result
if (place.geometry === undefined || place.geometry === null) {
return;
}
// set name, latitude, longitude
const address = this.originInput.nativeElement.value;
const coords = {
lat: place.geometry.location.lat(),
lng: place.geometry.location.lng()
};
this.searchService.originNewLocation(address, coords);
// this.searchService.originChange(address, coords);
this.searchService.updateInputFocus();
});
});
}
ngOnInit() {
this.mapsAPILoader.load().then(() => {
const autocomplete = new google.maps.places.Autocomplete(this.destinationInput.nativeElement, {
types: ['address']
});
autocomplete.addListener('place_changed', () => {
// get the place result
const place: google.maps.places.PlaceResult = autocomplete.getPlace();
// verify result
if (place.geometry === undefined || place.geometry === null) {
return;
}
// set name, latitude, longitude
const address = this.destinationInput.nativeElement.value;
const coords = {
lat: place.geometry.location.lat(),
lng: place.geometry.location.lng()
};
this.searchService.destinationNewLocation(address, coords);
this.searchService.updateInputFocus();
});
});
}
return Observable.create(observer => {
try {
//at this point the variable google may be still undefined (google maps scripts still loading)
//so load all the scripts, then...
this.__loader.load().then(() => {
let geocoder = new google.maps.Geocoder();
geocoder.geocode({ address }, (results, status) => {
if (status === google.maps.GeocoderStatus.OK) {
const place = results[0].geometry.location;
observer.next(place);
observer.complete();
} else {
console.error('Error - ', results, ' & Status - ', status);
if (status === google.maps.GeocoderStatus.ZERO_RESULTS) {
observer.error('Address not found!');
}else {
observer.error(status);
}
observer.complete();
}
});
});
} catch (error) {
observer.error('error getGeocoding' + error);
observer.complete();
}
});
constructor(
private mapsAPILoader: MapsAPILoader,
private searchService: SearchService
) {
this.mapsAPILoader.load().then(() => {
this.geocoder = new google.maps.Geocoder();
});
}
ngAfterViewInit() {
this.mapsAPILoader.load().then(() => {
this.apiWrapper.getNativeMap().then((m) => {
this.mapService.initializeMapFromMapExtension(m);
}, err => {
console.log('Error', err );
});
});
this.geolocationService.getCurrentPosition();
}
ngOnInit() {
//change the title back to normal
document.getElementById('title').innerHTML = 'Google Bytes';
// functionality to allow for autocomplete
this.mapsAPILoader.load().then( () => {
let autocomplete = new google.maps.places.Autocomplete(this.searchElement.nativeElement, {
types:[]});
autocomplete.addListener('place_changed', ()=>{
this.ngZone.run(()=>{
let place: google.maps.places.PlaceResult = autocomplete.getPlace();
//takes the lat and long from the auto complete and inserts them into the globals
this.lat = place.geometry.location.lat();
this.long = place.geometry.location.lng();
})
})
});
}
ngOnInit() {
this.searchElementRef.nativeElement.value = this.address || '';
this.mapsAPILoader.load().then(() => {
let autocomplete = new google.maps.places.Autocomplete(
this.searchElementRef.nativeElement,
{
types: ['address']
}
);
autocomplete.addListener('place_changed', () => {
this.ngZone.run(() => {
//get the place result
let place: google.maps.places.PlaceResult = autocomplete.getPlace();
//verify result
if (place.geometry === undefined || place.geometry === null) {
return;
}
// this.address.search = this.searchElementRef.nativeElement.value;
// place.address_components.forEach((address_component, index) => {
// console.log(address_component);
// if (address_component.types.includes('locality'))
// // this.addressForm.setValue({ city: address_component.long_name });
// this.address.city = address_component.long_name;
// else if (
// address_component.types.includes('administrative_area_level_1')
// )
// // this.addressForm.setValue({ state: address_component.long_name });
// this.address.state = address_component.long_name;
// else if (address_component.types.includes('country'))
// // this.addressForm.setValue({
// // country: address_component.long_name
// // });
// this.address.country = address_component.long_name;
// });
this.addressChanged.emit(place);
});
});
});
}