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

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

  • PlacesService (eski), photos alanı istekte belirtilmişse herhangi bir getDetails() isteği için PlaceResult nesnesi kapsamında en fazla 10 PlacePhoto nesnesi dizisi döndürür. textSearch() ve nearbySearch() için, varsa varsayılan olarak ilk yer fotoğrafı döndürülür.
  • Place sınıfı, istekte photos alanı belirtilmişse fetchFields() isteği kapsamında 10'a kadar Photo nesnesi içeren bir dizi döndürür.

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

PlacesService (Eski) Place (Yeni)
PlacePhoto arayüzü Photo sınıf
PlacePhoto, html_attributions değerini dize olarak döndürür. Photo, AuthorAttribution örneği döndürür.
Yöntemler, sonuçlar nesnesini ve google.maps.places.PlacesServiceStatus yanıtını işlemek için geri çağırma işlevinin kullanılmasını gerektirir. Promise'leri kullanır ve eşzamansız olarak çalışır.
Yöntemler için PlacesServiceStatus kontrolü gerekir. Zorunlu durum kontrolü yoktur, standart hata işleme kullanılabilir.
PlacesService, bir harita veya div öğesi kullanılarak örneklenmelidir. Place, harita veya sayfa öğesine referans vermeden gerektiği her yerde örneklendirilebilir.

Kod karşılaştırması

Bu bölümde, Yerler Hizmeti ile Yer sınıfı arasındaki farkları göstermek için yer fotoğraflarıyla ilgili kod karşılaştırılmaktadır. Kod snippet'leri, ilgili API'lerde yer fotoğrafları istemek için gereken kodu gösterir.

Yerler hizmeti (eski)

Aşağıdaki snippet'te, PlacesService kullanarak geri gelen fotoğraflar gösterilmekte ve sayfada ilk fotoğraf sonucu görüntülenmektedir. Bu örnekte yer ayrıntıları isteği, name ve photos alanlarının yanı sıra bir yer kimliği belirtir. 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ılmıştı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'teki yazar atıfları

PlacesService, gerekli yazar ilişkilendirmelerini yazarın Google profil sayfasına yönlendiren bir URL içeren html_attributions dizesini döndürür. Aşağıdaki snippet'te, ilk fotoğraf sonucu için ilişkilendirme verilerinin alınması 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ı dahil olmak üzere yer ayrıntılarını döndürmek için fetchFields() yönteminin kullanımı gösterilmektedir. Öncelikle 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 ele alındığından bu durumu kontrol etmeniz gerekmez.

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ı, yazarın Google profil sayfası için URI'yi ve yazarın profil fotoğrafı için URI'yi içeren bir AuthorAttribution örneği olarak yazar ilişkilendirmelerini döndürür. Aşağıdaki snippet'te, ilk fotoğraf sonucu için ilişkilendirme verilerinin alınması 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