फ़ील्ड फ़ेच करना
अगर आपके पास कोई मौजूदा Place
ऑब्जेक्ट या जगह का आईडी है, तो उस जगह के बारे में जानकारी पाने के लिए, Place.fetchFields()
तरीके का इस्तेमाल करें. वापस पाने के लिए, जगह के डेटा फ़ील्ड की कॉमा लगाकर अलग की गई सूची दें;
फ़ील्ड के नाम कैमल केस में डालें. अनुरोध किए गए फ़ील्ड का डेटा पाने के लिए, दिखाए गए Place
ऑब्जेक्ट का इस्तेमाल करें.
यहां दिए गए उदाहरण में, जगह के आईडी का इस्तेमाल करके नया Place
बनाया गया है. साथ ही, displayName
और formattedAddress
फ़ील्ड का अनुरोध करने के लिए, Place.fetchFields()
को कॉल किया गया है. इसके अलावा, मैप में मार्कर जोड़ा गया है और कुछ डेटा को कंसोल में लॉग किया गया है.
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
और Place
को इस फ़ंक्शन से पहले ही तय कर दिया गया है:
const { Map } = await google.maps.importLibrary("maps"); const { Place } = await google.maps.importLibrary("places");