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)getDetails()
isteği içinPlaceResult
nesnesinin bir parçası olarak en fazla 10PlacePhoto
nesnesinden oluşan bir dizi döndürür. Bu işlem, istektephotos
alanı belirtilmişse gerçekleştirilir.textSearch()
venearbySearch()
durumunda, varsa varsayılan olarak ilk yerin fotoğrafı döndürülür.Place
sınıfı, istektephotos
alanı belirtilmişsefetchFields()
isteğinin bir parçası olarak en fazla 10Photo
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 değerini dize olarak 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 , bir harita veya sayfa öğesine referans verilmeden gerektiği her yerde örneklenebilir. |
Kod karşılaştırması
Bu bölümde, Yer Hizmeti ile Yer sınıfı arasındaki farkları göstermek için yer fotoğraflarının kodu karşılaştırılır. Kod snippet'leri, ilgili API'lerde yer fotoğrafları istemek için gereken kodu gösterir.
Yer hizmeti (eski)
Aşağıdaki snippet'te, PlacesService
kullanılarak döndürülen fotoğraflar ve sayfada ilk fotoğraf sonucunun gösterilmesi yer almaktadır. Bu örnekte, yer ayrıntıları isteğinde name
ve photos
alanlarıyla birlikte bir yer kimliği belirtiliyor.
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
'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ı da 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 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ı, yazarın Google profili sayfasının URI'sini ve yazarın profil fotoğrafının URI'sini 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;