অবজেক্ট প্লেস করা
Place অবজেক্ট, যাতে কোনও জায়গা সম্পর্কে তথ্য থাকে, সেটি টেক্সট সার্চ, আশেপাশের সার্চ ও প্লেস অটোকমপ্লিট
ফিচার ডায়নামিক পদ্ধতিতে রিটার্ন করে। এছাড়াও, আপনি প্লেস আইডি বা রিসোর্স নাম (রিসোর্স নামের আগে
places/ থাকে) থেকে Place
অবজেক্ট তৈরি করতে পারেন। নিম্নলিখিত স্নিপেটে প্লেস আইডি ব্যবহার করে Place অবজেক্ট তৈরি করা দেখানো হয়েছে:
// Use a place ID to create a new Place instance. const place = new Place({ id: 'ChIJyYB_SZVU2YARR-I1Jjf08F0', // San Diego Zoo });
এছাড়াও, আপনি প্লেস রিসোর্স নাম থেকে Place অবজেক্ট তৈরি করতে পারেন:
// Use a place resource name to create a new Place instance. const place = new Place({ resourceName: 'places/ChIJyYB_SZVU2YARR-I1JRF08F0', // San Diego Zoo });
আরও তথ্যের জন্য, PlaceOptions দেখুন।
ফিল্ড ফেচ করা
আপনার কাছে আগে থেকেই Place অবজেক্ট, বা প্লেস আইডি বা রিসোর্স নাম থাকলে, সেই জায়গা সম্পর্কে বিবরণ পেতে
Place.fetchFields() পদ্ধতি ব্যবহার করুন। রিটার্ন করার জন্য কমা দিয়ে আলাদা করা
প্লেস ডেটা ফিল্ডের তালিকা
প্রদান করুন; ক্যামেল কেসে ফিল্ডের নাম উল্লেখ করুন। অনুরোধ করা ফিল্ডের ডেটা পেতে
ফেরত পাওয়া Place অবজেক্ট ব্যবহার করুন।
নিচের উদাহরণে একটি নতুন Place তৈরি করতে প্লেস আইডি ব্যবহার করা হয়েছে, displayName ও formattedAddress ফিল্ডের জন্য অনুরোধ করে Place.fetchFields()
কল করা হয়েছে এবং ম্যাপে একটি
মার্কার যোগ করা হয়েছে।
TypeScript
async function getPlaceDetails() { const [{ Place }, { AdvancedMarkerElement }] = await Promise.all([ google.maps.importLibrary('places'), 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, }); }
জাভাস্ক্রিপ্ট
async function getPlaceDetails() { const [{ Place }, { AdvancedMarkerElement }] = await Promise.all([ google.maps.importLibrary('places'), 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");