Yeni Yer Fotoğrafları'na taşıma

Avrupa Ekonomik Alanı (AEA) geliştiricileri

Yer fotoğrafları, web sayfalarınıza yüksek kaliteli fotoğraf içerikleri eklemenizi sağlar. Bu sayfada, Place sınıfı (yeni) ve PlacesService (eski) içindeki yer fotoğrafları özellikleri arasındaki farklar açıklanmakta ve karşılaştırma için bazı kod snippet'leri verilmektedir.

  • PlacesService (eski), photos alanı istekte belirtilmişse herhangi bir getDetails() isteği için PlaceResult nesnesinin bir parçası olarak en fazla 10 PlacePhoto nesnesinin dizisini döndürür. textSearch() ve nearbySearch() durumunda, varsa varsayılan olarak ilk yerin fotoğrafı döndürülür.
  • Place sınıfı, istekte photos alanı belirtilmişse fetchFields() isteğinin bir parçası olarak en fazla 10 Photo nesnesinden oluşan bir dizi döndürür.

Aşağıdaki tabloda, Place sınıfı ile PlacesService arasındaki yer fotoğraflarının kullanımındaki bazı temel farklılıklar listelenmiştir:

PlacesService (Eski) Place (Yeni)
PlacePhoto arayüzü Photo sınıfı
PlacePhoto, html_attributions dizesini döndürür. Photo, AuthorAttribution örneğini döndürür.
Yöntemler, sonuç nesnesini ve google.maps.places.PlacesServiceStatus yanıtını işlemek için geri çağırma işlevinin kullanılmasını gerektirir. Promises kullanır ve eşzamansız olarak çalışır.
Yöntemler için PlacesServiceStatus kontrolü gerekir. Durum kontrolü gerekmez, standart hata işleme kullanılabilir. Daha fazla bilgi
PlacesService, bir harita veya div öğesi kullanılarak oluşturulmalıdır. Place, harita veya sayfa öğesine referans verilmeden gerektiği her yerde örneklenebilir.

Kod karşılaştırması

Bu bölümde, yer fotoğraflarıyla ilgili kod karşılaştırılarak Places Service ile Place sınıfı arasındaki farklar açıklanmaktadır. Kod snippet'leri, ilgili API'lerde yer fotoğrafları istemek için gereken kodu gösterir.

Yer hizmeti (eski)

Aşağıdaki snippet, PlacesService kullanılarak döndürülen fotoğrafları ve sayfadaki ilk fotoğraf sonucunu gösterir. Bu örnekte, yer ayrıntıları isteğinde name ve photos alanlarıyla birlikte bir yer kimliği belirtiliyor. Ardından, hizmet durumu kontrol edildikten sonra ilk fotoğraf sayfada gösterilir. PlacesService öğesi oluşturulurken bir harita veya div öğesi belirtilmelidir. Bu örnekte harita bulunmadığından div öğesi kullanılır.

function getPhotos() {
  // Construct the Place Details request.
  const request = {
    placeId: "ChIJydSuSkkUkFQRsqhB-cEtYnw",
    fields: ["name", "photos"],
  };

  // Create an instance of PlacesService.
  const attributionDiv = document.getElementById("attribution-div");
  const service = new google.maps.places.PlacesService(attributionDiv);

  // Check status and display the first photo in an img element.
  service.getDetails(request, (place, status) => {
    if (
      status === google.maps.places.PlacesServiceStatus.OK && place
    ) {
      const photoImg = document.getElementById('image-container');
      photoImg.src = place.photos[0].getUrl({maxHeight: 400});
    }
  });
}

PlacesService'daki yazar ilişkilendirmeleri

PlacesService, gerekli yazar atıflarını yazarın Google profil sayfasına yönlendiren bir URL içeren html_attributions dizesi olarak döndürür. Aşağıdaki snippet'te, ilk fotoğraf sonucu için ilişkilendirme verilerinin nasıl alındığı gösterilmektedir.

let attributionUrl = place.photos[0].html_attributions;

Daha fazla bilgi

Yer sınıfı (yeni)

Aşağıdaki snippet'te, görünen ad ve yer fotoğrafları gibi yer ayrıntılarını döndürmek için fetchFields() yönteminin kullanımı gösterilmektedir. Önce bir yer kimliği kullanılarak yeni bir Place nesnesi oluşturulur, ardından displayName ve photos alanlarının belirtildiği fetchFields() çağrısı yapılır. Ardından, ilk yerin fotoğrafı sayfada gösterilir. Place sınıfı kullanılırken hizmet durumu otomatik olarak işlendiğinden kontrol etmenize gerek yoktur.

async function getPhotos() {
  // Use a place ID to create a new Place instance.
  const place = new google.maps.places.Place({
      id: 'ChIJydSuSkkUkFQRsqhB-cEtYnw', // Woodland Park Zoo, Seattle WA
  });

  // Call fetchFields, passing the needed data fields.
  await place.fetchFields({ fields: ['displayName','photos'] });

  console.log(place.displayName);
  console.log(place.photos[0]);
  // Add the first photo to an img element.
  const photoImg = document.getElementById('image-container');
  photoImg.src = place.photos[0].getURI({maxHeight: 400});
}

Place sınıfındaki yazar ilişkilendirmeleri

Place sınıfı, yazarın adını, Google profil sayfası için bir URI'yi ve yazarın profil fotoğrafı için bir URI'yi içeren bir AuthorAttribution örneği olarak yazar atıflarını döndürür. Aşağıdaki snippet'te, ilk fotoğraf sonucu için ilişkilendirme verilerinin nasıl alındığı gösterilmektedir.

let name = place.photos[0].authorAttributions[0].displayName;
let attributionUrl = place.photos[0].authorAttributions[0].uri;
let photoUrl = place.photos[0].authorAttributions[0].photoUri;

Daha fazla bilgi