'जगह की फ़ोटो' के नए वर्शन पर माइग्रेट करना

यूरोपियन इकनॉमिक एरिया (ईईए) के डेवलपर

Place Photos की मदद से, अपने वेब पेजों पर अच्छी क्वालिटी का फ़ोटोग्राफ़िक कॉन्टेंट जोड़ा जा सकता है. इस पेज पर, Place क्लास (नई) और PlacesService (लेगसी) में मौजूद, जगह की फ़ोटो की सुविधाओं के बीच के अंतर के बारे में बताया गया है. साथ ही, तुलना करने के लिए कुछ कोड स्निपेट दिए गए हैं.

  • PlacesService (लेगसी) किसी भी getDetails() अनुरोध के लिए, PlaceResult ऑब्जेक्ट के हिस्से के तौर पर ज़्यादा से ज़्यादा 10 PlacePhoto ऑब्जेक्ट का कलेक्शन दिखाता है. ऐसा तब होता है, जब अनुरोध में photos फ़ील्ड की जानकारी दी गई हो. textSearch() और nearbySearch() के मामले में, अगर जगह की पहली फ़ोटो उपलब्ध है, तो उसे डिफ़ॉल्ट रूप से दिखाया जाता है.
  • अगर अनुरोध में photos फ़ील्ड की जानकारी दी गई है, तो Place क्लास, fetchFields() अनुरोध के हिस्से के तौर पर ज़्यादा से ज़्यादा 10 Photo ऑब्जेक्ट का कलेक्शन दिखाती है.

यहां दी गई टेबल में, Place क्लास और PlacesService के बीच, जगह की फ़ोटो के इस्तेमाल में होने वाले कुछ मुख्य अंतर बताए गए हैं:

PlacesService (लेगसी) Place (नया)
PlacePhoto इंटरफ़ेस Photo क्लास
PlacePhoto, html_attributions को स्ट्रिंग के तौर पर दिखाता है. Photo, AuthorAttribution इंस्टेंस दिखाता है.
नतीजों के ऑब्जेक्ट और google.maps.places.PlacesServiceStatus रिस्पॉन्स को मैनेज करने के लिए, तरीकों में कॉलबैक का इस्तेमाल करना ज़रूरी है. यह Promises का इस्तेमाल करता है और एसिंक्रोनस तरीके से काम करता है.
इन तरीकों के लिए, PlacesServiceStatus की जांच ज़रूरी है. स्टेटस की जांच करने की ज़रूरत नहीं है, स्टैंडर्ड गड़बड़ी को ठीक करने के लिए इस्तेमाल किया जा सकता है. ज़्यादा जानें.
PlacesService को मैप या div एलिमेंट का इस्तेमाल करके इंस्टैंशिएट किया जाना चाहिए. Place को ज़रूरत के हिसाब से कहीं भी इंस्टैंशिएट किया जा सकता है. इसके लिए, मैप या पेज एलिमेंट के रेफ़रंस की ज़रूरत नहीं होती.

कोड की तुलना

इस सेक्शन में, जगह की फ़ोटो के लिए कोड की तुलना की गई है. इससे, Places सेवा और Place क्लास के बीच के अंतर को समझने में मदद मिलती है. कोड स्निपेट में, हर एपीआई पर जगह की फ़ोटो का अनुरोध करने के लिए ज़रूरी कोड दिखाया गया है.

Places service (लेगसी)

यहां दिए गए स्निपेट में, 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 स्ट्रिंग के तौर पर दिखाता है. इसमें लेखक के Google प्रोफ़ाइल पेज पर ले जाने वाला यूआरएल शामिल होता है. यहां दिए गए स्निपेट में, पहली फ़ोटो के नतीजे के लिए एट्रिब्यूशन डेटा को वापस पाने का तरीका बताया गया है.

let attributionUrl = place.photos[0].html_attributions;

ज़्यादा जानें

जगह की क्लास (नई)

यहां दिए गए स्निपेट में, 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 इंस्टेंस के तौर पर दिखाती है. इसमें लेखक का नाम, लेखक के Google प्रोफ़ाइल पेज का यूआरआई, और लेखक की प्रोफ़ाइल फ़ोटो का यूआरआई शामिल होता है. यहां दिए गए स्निपेट में, पहले फ़ोटो नतीजे के लिए एट्रिब्यूशन डेटा को वापस पाने का तरीका बताया गया है.

let name = place.photos[0].authorAttributions[0].displayName;
let attributionUrl = place.photos[0].authorAttributions[0].uri;
let photoUrl = place.photos[0].authorAttributions[0].photoUri;

ज़्यादा जानें