2017-02-21 14 views
0

Я хочу извлечь изображения Google google из идентификатора места в моем приложении angular2. Я получаю место от метода Autocomplete.Angular2: Как получить фотографии google place из идентификатора места?

Я использую angular2-google-map library.

import { Component, NgZone, Inject, OnInit, ViewChild, EventEmitter, ElementRef } from '@angular/core'; 
import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms'; 
import { AgmCoreModule, MapsAPILoader } from 'angular2-google-maps/core'; 

declare var google: any; 

@Component({ 
    selector: 'add-location-component', 
    templateUrl: './addLocation.component.html' 
}) 
export class AddLocationComponent implements OnInit { 

    private googlePlaceId: any; 

    @ViewChild("search") 
    public searchElementRef: ElementRef; 
    public searchControl: FormControl; 

    constructor(
    public authService: AuthService, 
    private mapsAPILoader: MapsAPILoader, 
    @Inject(NgZone) private ngZone: NgZone 
) { } 

    ngOnInit() { 
    this.searchControl = new FormControl(); 
    this.mapsAPILoader.load().then(() => { 
     let autocomplete = new google.maps.places.Autocomplete(this.searchElementRef.nativeElement, { 
     types: ["address"] 
     }); 
     autocomplete.addListener("place_changed",() => { 
     this.ngZone.run(() => { 
      let place = autocomplete.getPlace(); 
      if (place.geometry === undefined || place.geometry === null) { 
      return; 
      } 
      this.googlePlaceId = place.place_id; 
      console.log(this.googlePlaceId); 
     }); 
     }); 
    }); 
    } 

}

Используя place_id или Lattitude и долготы я хочу принести первые 10 фотографий этого места. Я застрял здесь с угловой2-google-картой.

Можете ли вы, ребята, помочь мне. Спасибо.

ответ

2

С этим местом, вы должны использовать класс PlacesService. Вы вызываете метод getDetails, и в обратном вызове вы получаете PlaceResult, у которого есть свойство photos (это массив из PhotoPlace, на который вы вызываете метод getUrl для получения отображаемого изображения).

(что означает, как вы извлекли Уложите библиотеку, а также ядро ​​Google Maps библиотеки API)

function RetrievePhotoUrlsFromPlaceId(placeId) { 
    /* Instantiate a placesService */ 
    var placesService = new google.maps.places.PlacesService(); 

    /* Get place details */ 
    placesServices.getDetails({ 
    placeId: placeId 
    }, (placeResult, status) => { 
    if(status === 'OK') { 
     var photos = placeResult.photos; 
     var urls = []; // we will store the urls here 

     photos.forEach((photo) => { 
     urls.push(photo.getUrl({ 
      maxWidht: 500, // at least set one or the other - mandatory 
      maxHeight: undefined 
     })); 
     }); 

     /* You have your URLs here !! */ 
    } 
    }); 
} 

[править]

На самом деле гораздо проще, так как вы используете Autocomplete и поэтому вы уже есть PlaceResult.

function RetrievePhotoUrlsFromPlace(place) { 

    var photos = place.photos; 
    var urls = []; // we will store the urls here 

      photos.forEach((photo) => { 
      urls.push(photo.getUrl({ 
       maxWidht: 500, // at least set one or the other - mandatory 
       maxHeight: undefined 
      })); 
      }); 

      /* You have your URLs here !! */ 
     } 
+0

Я пытался в соответствии с вашим решением, но получаю эту ошибку ** google.maps.PlacesService не конструктор ** –

+0

вы, вероятно, не имеют место библиотеки загружены – ValLeNain

+0

Да, я добавил 'AgmCoreModule.forRoot ({ apiKey: GOOGLEAPIKEY, библиотека: [ "место"] }) ' –