Alanları getirme
Mevcut bir Place
nesneniz veya yer kimliğiniz varsa bu yerle ilgili ayrıntıları almak için Place.fetchFields()
yöntemini kullanın. Döndürülecek yer verisi alanlarının virgülle ayrılmış bir listesini sağlayın;
alan adlarını camel case olarak belirtin. İstenen alanlarla ilgili verileri almak için döndürülen Place
nesnesini kullanın.
Aşağıdaki örnekte yeni bir Place
oluşturmak için yer kimliği kullanılıyor, displayName
ve formattedAddress
alanları istenerek Place.fetchFields()
çağrılıyor, haritaya bir işaretçi ekleniyor ve bazı veriler konsola kaydediliyor.
TypeScript
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
ve Place
'nin bu işlevden önce tanımlandığını unutmayın:
const { Map } = await google.maps.importLibrary("maps"); const { Place } = await google.maps.importLibrary("places");