Извлечь поля
Если у вас есть существующий объект Place
или идентификатор места, используйте метод Place.fetchFields()
для получения информации об этом месте. Укажите список полей данных о месте, разделённых запятыми; имена полей указывайте в стиле «camel». Используйте возвращаемый объект Place
для получения данных для запрошенных полей.
В следующем примере используется идентификатор места для создания нового Place
, вызывается Place.fetchFields()
запрашивающий поля displayName
и formattedAddress
, добавляется маркер на карту и выводятся некоторые данные в консоль.
Машинопись
async function getPlaceDetails() { const { Place } = await google.maps.importLibrary("places") as google.maps.PlacesLibrary; const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary; // Use place ID to create a new Place instance. const place = new Place({ id: 'ChIJyYB_SZVU2YARR-I1Jjf08F0', // San Diego Zoo }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location', 'googleMapsURI'] }); // Add an Advanced Marker const marker = new AdvancedMarkerElement({ map: innerMap, position: place.location, title: place.displayName, }); // Assemble the info window content. const content = document.createElement('div'); const address = document.createElement('div'); const placeId = document.createElement('div'); address.textContent = place.formattedAddress || ''; placeId.textContent = place.id; content.append(placeId, address); if (place.googleMapsURI) { const link = document.createElement('a'); link.href = place.googleMapsURI; link.target = '_blank'; link.textContent = 'View Details on Google Maps'; content.appendChild(link); } // Display an info window. infoWindow.setHeaderContent(place.displayName); infoWindow.setContent(content); infoWindow.open({ anchor: marker, }); }
JavaScript
async function getPlaceDetails() { const { Place } = await google.maps.importLibrary("places"); const { AdvancedMarkerElement } = await google.maps.importLibrary("marker"); // Use place ID to create a new Place instance. const place = new Place({ id: 'ChIJyYB_SZVU2YARR-I1Jjf08F0', // San Diego Zoo }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: ['displayName', 'formattedAddress', 'location', 'googleMapsURI'] }); // Add an Advanced Marker const marker = new AdvancedMarkerElement({ map: innerMap, position: place.location, title: place.displayName, }); // Assemble the info window content. const content = document.createElement('div'); const address = document.createElement('div'); const placeId = document.createElement('div'); address.textContent = place.formattedAddress || ''; placeId.textContent = place.id; content.append(placeId, address); if (place.googleMapsURI) { const link = document.createElement('a'); link.href = place.googleMapsURI; link.target = '_blank'; link.textContent = 'View Details on Google Maps'; content.appendChild(link); } // Display an info window. infoWindow.setHeaderContent(place.displayName); infoWindow.setContent(content); infoWindow.open({ anchor: marker, }); }
Map
и Place
были объявлены до этой функции:const { Map } = await google.maps.importLibrary("maps"); const { Place } = await google.maps.importLibrary("places");