Функция Place Photos позволяет добавлять на веб-страницы высококачественные фотографии.
На этой странице объясняются различия между функциями фотографий мест в классе Place (новом) и PlacesService (устаревшем), а также приводятся некоторые фрагменты кода для сравнения.
PlacesService(устаревший) возвращает массив, содержащий до 10 объектовPlacePhoto, в составе объектаPlaceResultдля любого запросаgetDetails(), если в запросе указано полеphotos. В случае сtextSearch()иnearbySearch()по умолчанию возвращается первая фотография места, если она доступна.- Класс
Placeвозвращает массив, содержащий до 10 объектовPhoto, в составе запросаfetchFields(), если в запросе указано полеphotos.
В таблице ниже перечислены некоторые основные различия в использовании фотографий мест между классом Place и PlacesService.
PlacesService (устаревшая версия) |
Place (новое) |
|---|---|
Интерфейс PlacePhoto |
Класс Photo |
PlacePhoto возвращает
html_attributions в виде строки. |
Photo возвращает экземпляр объекта
AuthorAttribution. |
Для обработки объекта результатов и ответа google.maps.places.PlacesServiceStatus нужно использовать метод обратного вызова. |
Использует объекты Promise и работает асинхронно. |
Для методов требуется проверка PlacesServiceStatus. |
Проверка статуса не требуется, можно использовать стандартную обработку ошибок. Подробнее… |
Экземпляр PlacesService должен быть создан с помощью карты или элемента div. |
Экземпляр Place можно создать в любом месте, не ссылаясь на карту или элемент страницы. |
Сравнение кода
В этом разделе сравнивается код для фотографий мест, чтобы проиллюстрировать различия между сервисом Places и классом Place. Фрагменты кода показывают, какой код требуется для запроса фотографий мест в каждом API.
Сервис Places (устаревший)
В следующем фрагменте кода показано, как получить фотографии с помощью PlacesService и показать первую из них на странице. В этом примере запрос сведений о месте содержит идентификатор места, а также поля name и photos.
После проверки статуса сервиса на странице появляется первая фотография.
При создании экземпляра PlacesService необходимо указать карту или элемент div. Поскольку в этом примере карты нет, используется элемент div.
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
Метод PlacesService возвращает обязательные атрибуты автора в виде строки html_attributions, содержащей URL страницы профиля автора в Google. В следующем фрагменте кода показано, как получить данные об авторстве для первого результата поиска фотографий.
let attributionUrl = place.photos[0].html_attributions;
Подробнее…
Класс Place (новый)
В следующем фрагменте кода показано, как использовать метод fetchFields(), чтобы получить информацию о месте, включая отображаемое название и фотографии.
Сначала создается экземпляр нового объекта Place с использованием идентификатора места, а затем вызывается метод fetchFields(), в котором указываются поля displayName и photos.
После этого на странице будет показана первая фотография места. При использовании класса Place проверять статус сервиса не нужно, так как это происходит автоматически.
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
Класс Place возвращает сведения об авторе в виде экземпляра AuthorAttribution, который содержит имя автора, URI страницы его профиля Google и URI фото профиля. В следующем фрагменте кода показано, как получить данные об авторе для первого результата поиска фотографий.
let name = place.photos[0].authorAttributions[0].displayName;
let attributionUrl = place.photos[0].authorAttributions[0].uri;
let photoUrl = place.photos[0].authorAttributions[0].photoUri;
Подробнее…
- Посмотреть полный пример
- См. документацию
- Справочные материалы по
fetchFields() - Справочник по классу
Photo