जगहों के सुझाव ऑटोकंप्लीट करने की सुविधा

परिचय

ऑटोकंप्लीट, Maps JavaScript API में मौजूद Places लाइब्रेरी की एक सुविधा है. ऑटोकंप्लीट सुविधा का इस्तेमाल करके, अपने ऐप्लिकेशन में Google Maps के खोज फ़ील्ड की तरह टाइप-अहेड-सर्च की सुविधा दी जा सकती है. अपने-आप भरने की सुविधा, पूरे शब्दों और सबस्ट्रिंग से मिलान कर सकती है. इससे जगहों के नाम, पते, और प्लस कोड का पता लगाया जा सकता है. इसलिए, ऐप्लिकेशन उपयोगकर्ता के टाइप करते समय ही क्वेरी भेज सकते हैं, ताकि जगह के बारे में तुरंत अनुमान लगाया जा सके. Places API के मुताबिक, 'जगह' कोई प्रतिष्ठान, भौगोलिक जगह या लोकप्रिय जगह हो सकती है.

शुरू करना

Maps JavaScript API में Places लाइब्रेरी का इस्तेमाल करने से पहले, यह पुष्टि करें कि Google Cloud Console में Places API चालू हो. साथ ही, यह भी पुष्टि करें कि यह उसी प्रोजेक्ट में चालू हो जिसे आपने Maps JavaScript API के लिए सेट अप किया था.

चालू किए गए एपीआई की सूची देखने के लिए:

1. Google Cloud Console पर जाएं.
2. कोई प्रोजेक्ट चुनें बटन पर क्लिक करें. इसके बाद, वही प्रोजेक्ट चुनें जिसे आपने Maps JavaScript API के लिए सेट अप किया था. इसके बाद, खोलें पर क्लिक करें.
3. डैशबोर्ड पर मौजूद एपीआई की सूची में, Places API ढूंढें.
4. अगर आपको सूची में एपीआई दिखता है, तो आपको कोई कार्रवाई करने की ज़रूरत नहीं है. हालांकि, यह प्रोजेक्ट लेगसी स्टेटस में है. लेगसी स्टेज और लेगसी से नई सेवाओं पर माइग्रेट करने के तरीके के बारे में ज़्यादा जानने के लिए, लेगसी प्रॉडक्ट और सुविधाएं लेख पढ़ें. हालांकि, ऑटोकंप्लीट और SearchBox विजेट के लिए एक अपवाद उपलब्ध है. ये विजेट, Places API (नया) पर GA प्रॉडक्ट के तौर पर अभी उपलब्ध नहीं हैं.

लाइब्रेरी लोड करना

Places service, एक अलग लाइब्रेरी है. यह Maps JavaScript API के मुख्य कोड से अलग होती है. इस लाइब्रेरी में मौजूद सुविधाओं का इस्तेमाल करने के लिए, आपको पहले इसे लोड करना होगा. इसके लिए, Maps API के बूटस्ट्रैप यूआरएल में libraries पैरामीटर का इस्तेमाल करें:

<script async
    src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&loading=async&libraries=places&callback=initMap">
</script>

ज़्यादा जानकारी के लिए, लाइब्रेरी की खास जानकारी देखें.

क्लास की खास जानकारी

एपीआई, ऑटोकंप्लीट की सुविधा वाले दो तरह के विजेट उपलब्ध कराता है. इन्हें Autocomplete और SearchBox क्लास का इस्तेमाल करके जोड़ा जा सकता है. इसके अलावा, प्रोग्राम के हिसाब से ऑटोकंप्लीट के नतीजे पाने के लिए, AutocompleteService क्लास का इस्तेमाल किया जा सकता है. इसके लिए, Maps JavaScript API का रेफ़रंस देखें: AutocompleteService क्लास.

यहां उपलब्ध क्लास की खास जानकारी दी गई है:

• Autocomplete आपके वेब पेज में एक टेक्स्ट इनपुट फ़ील्ड जोड़ता है. साथ ही, यह फ़ील्ड में वर्णों की एंट्री पर नज़र रखता है. उपयोगकर्ता के टेक्स्ट डालने पर, अपने-आप पूरा होने की सुविधा, जगह के अनुमानों को ड्रॉप-डाउन सूची के तौर पर दिखाती है. जब उपयोगकर्ता सूची से किसी जगह को चुनता है, तो उस जगह की जानकारी, अपने-आप पूरा होने वाले ऑब्जेक्ट को वापस भेज दी जाती है. इसे आपका ऐप्लिकेशन वापस पा सकता है. इस बारे में ज़्यादा जानकारी यहां दी गई है.

  

  

• SearchBox आपके वेब पेज में टेक्स्ट इनपुट फ़ील्ड जोड़ता है. यह Autocomplete की तरह ही काम करता है. इनके बीच के अंतर यहां दिए गए हैं:
  • इन दोनों में मुख्य अंतर, पिक लिस्ट में दिखने वाले नतीजों का होता है. SearchBox, सुझावों की एक लंबी सूची उपलब्ध कराता है. इसमें Places API के हिसाब से तय की गई जगहों के साथ-साथ, खोज के लिए सुझाए गए शब्द भी शामिल हो सकते हैं. उदाहरण के लिए, अगर उपयोगकर्ता 'new में पिज़्ज़ा' डालता है, तो पिक लिस्ट में 'न्यूयॉर्क, न्यूयॉर्क में पिज़्ज़ा' वाक्यांश के साथ-साथ, पिज़्ज़ा आउटलेट के नाम भी शामिल हो सकते हैं.
  • SearchBox में, खोज के नतीजों को सीमित करने के लिए Autocomplete की तुलना में कम विकल्प मिलते हैं. पहले वाले विकल्प में, खोज के नतीजों को किसी दिए गए LatLngBounds के हिसाब से पक्षपातपूर्ण बनाया जा सकता है. बाद वाले तरीके में, खोज के नतीजों को किसी देश और किसी खास तरह की जगह तक सीमित किया जा सकता है. साथ ही, खोज के दायरे को भी सेट किया जा सकता है. ज़्यादा जानकारी के लिए, यहां देखें.

  

  इस बारे में ज़्यादा जानकारी यहां दी गई है.
• प्रोग्राम के हिसाब से अनुमान पाने के लिए, AutocompleteService ऑब्जेक्ट बनाया जा सकता है. मिलती-जुलती जगहों की जानकारी पाने के लिए, getPlacePredictions() को कॉल करें. इसके अलावा, मिलती-जुलती जगहों की जानकारी के साथ-साथ खोज के लिए सुझाए गए शब्द पाने के लिए, getQueryPredictions() को कॉल करें. ध्यान दें: AutocompleteService कोई यूज़र इंटरफ़ेस (यूआई) कंट्रोल नहीं जोड़ता. इसके बजाय, ऊपर दिए गए तरीके, अनुमान लगाने वाले ऑब्जेक्ट का कलेक्शन दिखाते हैं. हर अनुमानित जवाब वाले ऑब्जेक्ट में, अनुमानित जवाब का टेक्स्ट शामिल होता है. साथ ही, इसमें रेफ़रंस की जानकारी और यह जानकारी भी शामिल होती है कि जवाब, उपयोगकर्ता के इनपुट से कैसे मेल खाता है. इस बारे में ज़्यादा जानकारी यहां दी गई है.

ऑटोकंप्लीट विजेट जोड़ना

Autocomplete विजेट, आपके वेब पेज पर टेक्स्ट डालने का फ़ील्ड बनाता है. साथ ही, यूज़र इंटरफ़ेस (यूआई) में जगहों की सूची में जगहों के बारे में अनुमानित जानकारी देता है. इसके अलावा, getPlace() अनुरोध के जवाब में जगह की जानकारी दिखाता है. पिक लिस्ट में मौजूद हर एंट्री, किसी एक जगह से जुड़ी होती है. इसे Places API के हिसाब से तय किया जाता है.

Autocomplete कंस्ट्रक्टर दो आर्ग्युमेंट लेता है:

• text टाइप का एचटीएमएल input एलिमेंट. यह इनपुट फ़ील्ड है. अपने-आप पूरा होने वाली सेवा, इस पर नज़र रखेगी और इसके नतीजे अटैच करेगी.
• एक वैकल्पिक AutocompleteOptions आर्ग्युमेंट, जिसमें ये प्रॉपर्टी शामिल हो सकती हैं:
  • डेटा का एक ऐसा कलेक्शन fields जिसे उपयोगकर्ता के चुने गए PlaceResult के लिए, Place Details रिस्पॉन्स में शामिल किया जाना है. अगर प्रॉपर्टी सेट नहीं की गई है या ['ALL'] पास किया गया है, तो सभी उपलब्ध फ़ील्ड दिखाए जाते हैं और इनके लिए बिल भेजा जाता है. प्रोडक्शन डिप्लॉयमेंट के लिए, ऐसा करने का सुझाव नहीं दिया जाता. फ़ील्ड की सूची देखने के लिए, PlaceResult पर जाएं.
  • types की एक ऐसी कैटगरी जो किसी टाइप या टाइप कलेक्शन के बारे में साफ़ तौर पर बताती है. यह इस्तेमाल किए जा सकने वाले टाइप में दी गई सूची के मुताबिक होती है. अगर कोई टाइप नहीं दिया गया है, तो सभी टाइप दिखाए जाते हैं.
  • bounds एक google.maps.LatLngBounds ऑब्जेक्ट है. इसमें वह जगह बताई जाती है जहां जगहें खोजनी हैं. नतीजे, इन सीमाओं के अंदर मौजूद जगहों के हिसाब से पक्षपाती होते हैं. हालांकि, ऐसा सिर्फ़ इन्हीं जगहों के लिए नहीं होता.
  • strictBounds एक boolean है. इससे यह तय होता है कि एपीआई को सिर्फ़ उन जगहों की जानकारी देनी चाहिए जो bounds में तय किए गए क्षेत्र के अंदर आते हैं. एपीआई इस क्षेत्र से बाहर के नतीजे नहीं दिखाता. भले ही, वे उपयोगकर्ता के इनपुट से मेल खाते हों.
  • componentRestrictions का इस्तेमाल करके, नतीजों को किसी खास ग्रुप तक सीमित किया जा सकता है. componentRestrictions का इस्तेमाल करके, ज़्यादा से ज़्यादा पांच देशों के हिसाब से फ़िल्टर किया जा सकता है. देशों के नाम, दो वर्णों वाले ISO 3166-1 ऐल्फ़ा-2 के साथ काम करने वाले देश के कोड के तौर पर पास किए जाने चाहिए. एक से ज़्यादा देशों के लिए, देश के कोड की सूची पास की जानी चाहिए.

    ध्यान दें: अगर आपको देश के कोड से अनचाहे नतीजे मिलते हैं, तो पुष्टि करें कि आपने ऐसा कोड इस्तेमाल किया हो जिसमें वे देश, आश्रित क्षेत्र, और खास भौगोलिक क्षेत्र शामिल हों जिन्हें आपको टारगेट करना है. आपको कोड की जानकारी Wikipedia: List of ISO 3166 country codes या ISO Online Browsing Platform पर मिल सकती है.

  • placeIdOnly का इस्तेमाल, Autocomplete विजेट को सिर्फ़ जगह के आईडी वापस पाने के लिए निर्देश देने के लिए किया जा सकता है. Autocomplete ऑब्जेक्ट पर getPlace() को कॉल करने पर, उपलब्ध कराए गए PlaceResult में सिर्फ़ place id, types, और name प्रॉपर्टी सेट होंगी. जवाब में मिले प्लेस आईडी का इस्तेमाल, Places, Geocoding, Directions या Distance Matrix सेवाओं के लिए किए जाने वाले कॉल के साथ किया जा सकता है.

ऑटोकंप्लीट की सुविधा से मिलने वाले सुझावों को सीमित करना

डिफ़ॉल्ट रूप से, जगह की जानकारी अपने-आप भरने की सुविधा, सभी तरह की जगहों की जानकारी दिखाती है. हालांकि, यह सुविधा उपयोगकर्ता की जगह के आस-पास की जगहों के बारे में अनुमान लगाने पर ज़्यादा फ़ोकस करती है. साथ ही, उपयोगकर्ता की चुनी गई जगह के लिए उपलब्ध सभी डेटा फ़ील्ड फ़ेच करती है. जगह के नाम के लिए ऑटोकंप्लीट की सुविधा के विकल्प सेट करें, ताकि आपके इस्तेमाल के उदाहरण के आधार पर ज़्यादा काम के सुझाव दिए जा सकें.

कंस्ट्रक्शन के समय विकल्प सेट करना

Autocomplete कंस्ट्रक्टर, AutocompleteOptions पैरामीटर को स्वीकार करता है. इससे विजेट बनाते समय, कंस्ट्रेंट सेट किए जा सकते हैं. इस उदाहरण में, bounds, componentRestrictions, और types विकल्पों को सेट किया गया है. इससे establishment टाइप की जगहों के लिए अनुरोध किया जा सकता है. साथ ही, इसमें बताई गई भौगोलिक जगह के हिसाब से जगहों को प्राथमिकता दी जाती है. इसके अलावा, इसमें सिर्फ़ अमेरिका में मौजूद जगहों के लिए अनुमान लगाने की सुविधा दी जाती है. fields विकल्प सेट करने पर, यह तय किया जाता है कि उपयोगकर्ता की चुनी गई जगह के बारे में कौनसी जानकारी दिखानी है.

किसी मौजूदा विजेट के लिए, किसी विकल्प की वैल्यू बदलने के लिए setOptions() को कॉल करें.

const center = { lat: 50.064192, lng: -130.605469 };
// Create a bounding box with sides ~10km away from the center point
const defaultBounds = {
  north: center.lat + 0.1,
  south: center.lat - 0.1,
  east: center.lng + 0.1,
  west: center.lng - 0.1,
};
const input = document.getElementById("pac-input") as HTMLInputElement;
const options = {
  bounds: defaultBounds,
  componentRestrictions: { country: "us" },
  fields: ["address_components", "geometry", "icon", "name"],
  strictBounds: false,
};

const autocomplete = new google.maps.places.Autocomplete(input, options);
index.ts

const center = { lat: 50.064192, lng: -130.605469 };
// Create a bounding box with sides ~10km away from the center point
const defaultBounds = {
  north: center.lat + 0.1,
  south: center.lat - 0.1,
  east: center.lng + 0.1,
  west: center.lng - 0.1,
};
const input = document.getElementById("pac-input");
const options = {
  bounds: defaultBounds,
  componentRestrictions: { country: "us" },
  fields: ["address_components", "geometry", "icon", "name"],
  strictBounds: false,
};
const autocomplete = new google.maps.places.Autocomplete(input, options);
index.js

डेटा फ़ील्ड तय करना

उन डेटा फ़ील्ड के बारे में बताएं जिनके लिए आपको Places API के डेटा एसकेयू का बिल नहीं चाहिए. विजेट कंस्ट्रक्टर को पास किए गए AutocompleteOptions में fields प्रॉपर्टी शामिल करें. जैसा कि पिछले उदाहरण में दिखाया गया है या किसी मौजूदा Autocomplete ऑब्जेक्ट पर setFields() को कॉल करें.

autocomplete.setFields(["place_id", "geometry", "name"]);

ऑटोकंप्लीट के लिए, पूर्वाग्रहों और खोज के दायरे की सीमाओं को तय करना

ऑटोकंप्लीट सुविधा के नतीजों को किसी अनुमानित जगह या इलाके के हिसाब से बेहतर बनाया जा सकता है. इसके लिए, ये तरीके अपनाए जा सकते हैं:

• Autocomplete ऑब्जेक्ट बनाने की सीमाएं सेट करें.
• मौजूदा Autocomplete के दायरे में बदलाव करें.
• मैप के व्यूपोर्ट के लिए सीमाएं सेट करें.
• खोज को सीमाओं तक सीमित करें.
• खोज के नतीजों को किसी देश तक सीमित करना.

पिछले उदाहरण में, ऑब्जेक्ट बनाते समय ही उसकी सीमाएं सेट करने का तरीका दिखाया गया है. यहां दिए गए उदाहरणों में, अन्य पूर्वाग्रहों को कम करने की तकनीकों के बारे में बताया गया है.

अपने-आप पूरी होने वाली सुविधा के लिए, मौजूदा बाउंड्री में बदलाव करना

मौजूदा Autocomplete पर खोज के दायरे को आयताकार सीमा में बदलने के लिए, setBounds() को कॉल करें.

const southwest = { lat: 5.6108, lng: 136.589326 };
const northeast = { lat: 61.179287, lng: 2.64325 };
const newBounds = new google.maps.LatLngBounds(southwest, northeast);

autocomplete.setBounds(newBounds);
index.ts

const southwest = { lat: 5.6108, lng: 136.589326 };
const northeast = { lat: 61.179287, lng: 2.64325 };
const newBounds = new google.maps.LatLngBounds(southwest, northeast);

autocomplete.setBounds(newBounds);
index.js

मैप के व्यूपोर्ट के लिए सीमाएं सेट करना

bindTo() का इस्तेमाल करके, नतीजों को मैप के व्यूपोर्ट के हिसाब से व्यवस्थित करें. ऐसा तब भी किया जा सकता है, जब व्यूपोर्ट बदल रहा हो.

autocomplete.bindTo("bounds", map);
index.ts

autocomplete.bindTo("bounds", map);
index.js

ऑटोकंप्लीट की सुविधा से मिलने वाले सुझावों को मैप के व्यूपोर्ट से हटाने के लिए, unbind() का इस्तेमाल करें.

autocomplete.unbind("bounds");
autocomplete.setBounds({ east: 180, west: -180, north: 90, south: -90 });
index.ts

autocomplete.unbind("bounds");
autocomplete.setBounds({ east: 180, west: -180, north: 90, south: -90 });
index.js

उदाहरण देखें

खोज के दायरे को मौजूदा सीमाओं तक सीमित करें

strictBounds विकल्प सेट करके, नतीजों को मौजूदा सीमाओं तक सीमित करें. ये सीमाएं, मैप के व्यूपोर्ट या आयताकार सीमाओं के आधार पर तय की जाती हैं.

autocomplete.setOptions({ strictBounds: true });

किसी देश के लिए सुझावों को सीमित करना

componentRestrictions विकल्प का इस्तेमाल करें या setComponentRestrictions() पर कॉल करके, ऑटोकंप्लीट खोज को ज़्यादा से ज़्यादा पांच देशों के किसी खास सेट तक सीमित करें.

autocomplete.setComponentRestrictions({
  country: ["us", "pr", "vi", "gu", "mp"],
});
index.ts

autocomplete.setComponentRestrictions({
  country: ["us", "pr", "vi", "gu", "mp"],
});
index.js

उदाहरण देखें

जगह के टाइप सीमित करना

types विकल्प का इस्तेमाल करें या setTypes() को कॉल करके, अनुमानों को कुछ खास जगहों तक सीमित करें. यह कंस्ट्रेंट, जगह के टाइप में दिए गए टाइप या टाइप कलेक्शन के बारे में बताता है. अगर कोई कंस्ट्रेंट नहीं दी गई है, तो सभी टाइप दिखाए जाते हैं.

types विकल्प की वैल्यू या setTypes() को पास की गई वैल्यू के लिए, इनमें से कोई एक वैल्यू दी जा सकती है:

• टेबल 1 या टेबल 2 से जगह के टाइप की जानकारी देने वाला अरे. इसमें ज़्यादा से ज़्यादा पांच वैल्यू हो सकती हैं. उदाहरण के लिए:

  types: ['hospital', 'pharmacy', 'bakery', 'country']

  या:

  autocomplete.setTypes(['hospital', 'pharmacy', 'bakery', 'country']);

• जगह के टाइप में से, टेबल 3 में मौजूद कोई भी फ़िल्टर. सिर्फ़ टेबल 3 से एक वैल्यू दी जा सकती है.

अनुरोध तब अस्वीकार कर दिया जाएगा, जब:

• आपने पांच से ज़्यादा टाइप तय किए हों.
• आपने ऐसे टाइप तय किए हैं जिनकी पहचान नहीं की जा सकती.
• टेबल 1 या टेबल 2 के किसी भी टाइप को टेबल 3 के किसी भी फ़िल्टर के साथ मिक्स किया जा सकता है.

Places Autocomplete के डेमो में, अलग-अलग तरह की जगहों के लिए अनुमानों के बीच के अंतर को दिखाया गया है.

डेमो पेज पर जाएं

जगह की जानकारी पाना

जब कोई उपयोगकर्ता, ऑटोकंप्लीट टेक्स्ट फ़ील्ड से जुड़े सुझावों में से किसी जगह को चुनता है, तो सेवा place_changed इवेंट ट्रिगर करती है. जगह की जानकारी पाने के लिए:

1. place_changed इवेंट के लिए एक इवेंट हैंडलर बनाएं. इसके बाद, हैंडलर जोड़ने के लिए Autocomplete ऑब्जेक्ट पर addListener() को कॉल करें.
2. Autocomplete ऑब्जेक्ट पर Autocomplete.getPlace() को कॉल करें, ताकि PlaceResult ऑब्जेक्ट को वापस पाया जा सके. इसके बाद, इस ऑब्जेक्ट का इस्तेमाल करके चुनी गई जगह के बारे में ज़्यादा जानकारी पाई जा सकती है.

डिफ़ॉल्ट रूप से, जब कोई उपयोगकर्ता किसी जगह को चुनता है, तो अपने-आप भरने की सुविधा, चुनी गई जगह के लिए उपलब्ध सभी डेटा फ़ील्ड दिखाती है. इसके लिए, आपको उसी हिसाब से बिल भेजा जाएगा. Autocomplete.setFields() का इस्तेमाल करके, यह तय करें कि जगह की जानकारी वाले किन डेटा फ़ील्ड को वापस भेजना है. PlaceResult ऑब्जेक्ट के बारे में ज़्यादा पढ़ें. इसमें जगह के डेटा फ़ील्ड की सूची भी शामिल है, जिनके लिए अनुरोध किया जा सकता है. ज़रूरत न होने पर भी डेटा के लिए शुल्क चुकाने से बचने के लिए, Autocomplete.setFields() का इस्तेमाल करके सिर्फ़ उस जगह का डेटा शामिल करें जिसका आपको इस्तेमाल करना है.

name प्रॉपर्टी में, Places Autocomplete की सुविधा से मिले सुझावों से description शामिल होता है. description के बारे में ज़्यादा जानने के लिए, Places Autocomplete से जुड़ा दस्तावेज़ पढ़ें.

पते वाले फ़ॉर्म के लिए, पते को स्ट्रक्चर्ड फ़ॉर्मैट में पाना फ़ायदेमंद होता है. चुनी गई जगह का पूरा पता पाने के लिए, Autocomplete.setFields() को कॉल करें और address_components फ़ील्ड की जानकारी दें.

इस उदाहरण में, पते वाले फ़ॉर्म में फ़ील्ड भरने के लिए, अपने-आप पूरा होने की सुविधा का इस्तेमाल किया गया है.

function fillInAddress() {
  // Get the place details from the autocomplete object.
  const place = autocomplete.getPlace();
  let address1 = "";
  let postcode = "";

  // Get each component of the address from the place details,
  // and then fill-in the corresponding field on the form.
  // place.address_components are google.maps.GeocoderAddressComponent objects
  // which are documented at http://goo.gle/3l5i5Mr
  for (const component of place.address_components as google.maps.GeocoderAddressComponent[]) {
    // @ts-ignore remove once typings fixed
    const componentType = component.types[0];

    switch (componentType) {
      case "street_number": {
        address1 = `${component.long_name} ${address1}`;
        break;
      }

      case "route": {
        address1 += component.short_name;
        break;
      }

      case "postal_code": {
        postcode = `${component.long_name}${postcode}`;
        break;
      }

      case "postal_code_suffix": {
        postcode = `${postcode}-${component.long_name}`;
        break;
      }

      case "locality":
        (document.querySelector("#locality") as HTMLInputElement).value =
          component.long_name;
        break;

      case "administrative_area_level_1": {
        (document.querySelector("#state") as HTMLInputElement).value =
          component.short_name;
        break;
      }

      case "country":
        (document.querySelector("#country") as HTMLInputElement).value =
          component.long_name;
        break;
    }
  }

  address1Field.value = address1;
  postalField.value = postcode;

  // After filling the form with address components from the Autocomplete
  // prediction, set cursor focus on the second address line to encourage
  // entry of subpremise information such as apartment, unit, or floor number.
  address2Field.focus();
}
index.ts

function fillInAddress() {
  // Get the place details from the autocomplete object.
  const place = autocomplete.getPlace();
  let address1 = "";
  let postcode = "";

  // Get each component of the address from the place details,
  // and then fill-in the corresponding field on the form.
  // place.address_components are google.maps.GeocoderAddressComponent objects
  // which are documented at http://goo.gle/3l5i5Mr
  for (const component of place.address_components) {
    // @ts-ignore remove once typings fixed
    const componentType = component.types[0];

    switch (componentType) {
      case "street_number": {
        address1 = `${component.long_name} ${address1}`;
        break;
      }

      case "route": {
        address1 += component.short_name;
        break;
      }

      case "postal_code": {
        postcode = `${component.long_name}${postcode}`;
        break;
      }

      case "postal_code_suffix": {
        postcode = `${postcode}-${component.long_name}`;
        break;
      }
      case "locality":
        document.querySelector("#locality").value = component.long_name;
        break;
      case "administrative_area_level_1": {
        document.querySelector("#state").value = component.short_name;
        break;
      }
      case "country":
        document.querySelector("#country").value = component.long_name;
        break;
    }
  }

  address1Field.value = address1;
  postalField.value = postcode;
  // After filling the form with address components from the Autocomplete
  // prediction, set cursor focus on the second address line to encourage
  // entry of subpremise information such as apartment, unit, or floor number.
  address2Field.focus();
}

window.initAutocomplete = initAutocomplete;
index.js

उदाहरण देखें

प्लेसहोल्डर टेक्स्ट को पसंद के मुताबिक बनाना

ऑटोकंप्लीट सेवा से बनाए गए टेक्स्ट फ़ील्ड में, डिफ़ॉल्ट रूप से स्टैंडर्ड प्लेसहोल्डर टेक्स्ट होता है. टेक्स्ट में बदलाव करने के लिए, input एलिमेंट पर placeholder एट्रिब्यूट सेट करें:

<input id="searchTextField" type="text" size="50" placeholder="Anything you want!">

ध्यान दें: डिफ़ॉल्ट प्लेसहोल्डर टेक्स्ट, अपने-आप स्थानीय भाषा में बदल जाता है. अगर आपने खुद की प्लेसहोल्डर वैल्यू तय की है, तो आपको अपने ऐप्लिकेशन में उस वैल्यू के स्थानीयकरण को मैनेज करना होगा. Google Maps JavaScript API, इस्तेमाल की जाने वाली भाषा को कैसे चुनता है, इस बारे में जानकारी पाने के लिए स्थानीय भाषा में उपलब्ध कराने से जुड़ा दस्तावेज़ पढ़ें.

विजेट के दिखने के तरीके को पसंद के मुताबिक बनाने के लिए, ऑटोकंप्लीट और SearchBox विजेट की स्टाइल बदलना लेख पढ़ें.

SearchBox विजेट जोड़ना

SearchBox की मदद से, उपयोगकर्ता टेक्स्ट के आधार पर भौगोलिक खोज कर सकते हैं. जैसे, 'न्यूयॉर्क में पिज़्ज़ा' या 'रॉब्सन स्ट्रीट के पास जूते की दुकानें'. SearchBox को किसी टेक्स्ट फ़ील्ड से अटैच किया जा सकता है. इसके बाद, जैसे ही टेक्स्ट डाला जाता है वैसे ही सेवा, ड्रॉप-डाउन पिक लिस्ट के तौर पर अनुमानित नतीजे दिखाती है.

SearchBox, अनुमानों की एक लंबी सूची उपलब्ध कराता है. इसमें Places API के हिसाब से तय की गई जगहों के साथ-साथ, खोज के लिए सुझाए गए शब्द भी शामिल हो सकते हैं. उदाहरण के लिए, अगर उपयोगकर्ता 'new में पिज़्ज़ा' डालता है, तो पिक लिस्ट में 'न्यूयॉर्क, न्यूयॉर्क में पिज़्ज़ा' वाक्यांश के साथ-साथ, पिज़्ज़ा आउटलेट के नाम भी शामिल हो सकते हैं. जब कोई उपयोगकर्ता सूची से किसी जगह को चुनता है, तो उस जगह की जानकारी SearchBox ऑब्जेक्ट को वापस भेज दी जाती है. इसे आपका ऐप्लिकेशन वापस पा सकता है.

SearchBox कंस्ट्रक्टर दो आर्ग्युमेंट लेता है:

• text टाइप का एचटीएमएल input एलिमेंट. यह इनपुट फ़ील्ड है. SearchBox सेवा इस पर नज़र रखेगी और इसके नतीजों को इससे जोड़ेगी.
• options आर्ग्युमेंट, जिसमें bounds प्रॉपर्टी शामिल हो सकती है: bounds एक google.maps.LatLngBounds ऑब्जेक्ट है. यह उस इलाके के बारे में बताता है जहां जगहों को खोजना है. नतीजे, इन सीमाओं के अंदर मौजूद जगहों के हिसाब से पक्षपाती होते हैं. हालांकि, ये सिर्फ़ इन तक ही सीमित नहीं होते.

यहां दिए गए कोड में, नतीजों को किसी खास भौगोलिक इलाके में मौजूद जगहों के हिसाब से दिखाने के लिए, बाउंड पैरामीटर का इस्तेमाल किया गया है. इस इलाके की जानकारी, अक्षांश/देशांतर के निर्देशांकों का इस्तेमाल करके दी गई है.

var defaultBounds = new google.maps.LatLngBounds(
  new google.maps.LatLng(-33.8902, 151.1759),
  new google.maps.LatLng(-33.8474, 151.2631));

var input = document.getElementById('searchTextField');

var searchBox = new google.maps.places.SearchBox(input, {
  bounds: defaultBounds
});

SearchBox के लिए खोज की जगह बदलना

मौजूदा SearchBox के लिए खोज का दायरा बदलने के लिए, SearchBox ऑब्जेक्ट पर setBounds() को कॉल करें और उससे जुड़ा LatLngBounds ऑब्जेक्ट पास करें.

उदाहरण देखें

जगह की जानकारी पाना

जब उपयोगकर्ता, खोज बॉक्स से जुड़े सुझावों में से किसी आइटम को चुनता है, तो सेवा places_changed इवेंट ट्रिगर करती है. SearchBox ऑब्जेक्ट पर getPlaces() को कॉल करके, कई अनुमानों वाला एक कलेक्शन वापस पाया जा सकता है. इनमें से हर अनुमान एक PlaceResult ऑब्जेक्ट होता है.

PlaceResult ऑब्जेक्ट के बारे में ज़्यादा जानने के लिए, जगह की ज़्यादा जानकारी वाले नतीजों के बारे में दस्तावेज़ देखें.

// Listen for the event fired when the user selects a prediction and retrieve
// more details for that place.
searchBox.addListener("places_changed", () => {
  const places = searchBox.getPlaces();

  if (places.length == 0) {
    return;
  }

  // Clear out the old markers.
  markers.forEach((marker) => {
    marker.setMap(null);
  });
  markers = [];

  // For each place, get the icon, name and location.
  const bounds = new google.maps.LatLngBounds();

  places.forEach((place) => {
    if (!place.geometry || !place.geometry.location) {
      console.log("Returned place contains no geometry");
      return;
    }

    const icon = {
      url: place.icon as string,
      size: new google.maps.Size(71, 71),
      origin: new google.maps.Point(0, 0),
      anchor: new google.maps.Point(17, 34),
      scaledSize: new google.maps.Size(25, 25),
    };

    // Create a marker for each place.
    markers.push(
      new google.maps.Marker({
        map,
        icon,
        title: place.name,
        position: place.geometry.location,
      })
    );

    if (place.geometry.viewport) {
      // Only geocodes have viewport.
      bounds.union(place.geometry.viewport);
    } else {
      bounds.extend(place.geometry.location);
    }
  });
  map.fitBounds(bounds);
});
index.ts

// Listen for the event fired when the user selects a prediction and retrieve
// more details for that place.
searchBox.addListener("places_changed", () => {
  const places = searchBox.getPlaces();

  if (places.length == 0) {
    return;
  }

  // Clear out the old markers.
  markers.forEach((marker) => {
    marker.setMap(null);
  });
  markers = [];

  // For each place, get the icon, name and location.
  const bounds = new google.maps.LatLngBounds();

  places.forEach((place) => {
    if (!place.geometry || !place.geometry.location) {
      console.log("Returned place contains no geometry");
      return;
    }

    const icon = {
      url: place.icon,
      size: new google.maps.Size(71, 71),
      origin: new google.maps.Point(0, 0),
      anchor: new google.maps.Point(17, 34),
      scaledSize: new google.maps.Size(25, 25),
    };

    // Create a marker for each place.
    markers.push(
      new google.maps.Marker({
        map,
        icon,
        title: place.name,
        position: place.geometry.location,
      }),
    );
    if (place.geometry.viewport) {
      // Only geocodes have viewport.
      bounds.union(place.geometry.viewport);
    } else {
      bounds.extend(place.geometry.location);
    }
  });
  map.fitBounds(bounds);
});
index.js

उदाहरण देखें

विजेट के दिखने के तरीके को पसंद के मुताबिक बनाने के लिए, ऑटोकंप्लीट और SearchBox विजेट की स्टाइल बदलना लेख पढ़ें.

प्रोग्राम के हिसाब से, Place Autocomplete Service की मदद से मिलने वाले सुझावों को वापस पाना

प्रोग्राम के हिसाब से अनुमान पाने के लिए, AutocompleteService क्लास का इस्तेमाल करें. AutocompleteService कोई यूज़र इंटरफ़ेस (यूआई) कंट्रोल नहीं जोड़ता है. इसके बजाय, यह अनुमान लगाने वाले ऑब्जेक्ट की एक ऐरे दिखाता है. हर ऑब्जेक्ट में अनुमान का टेक्स्ट, रेफ़रंस की जानकारी, और इस बारे में जानकारी होती है कि नतीजा, उपयोगकर्ता के इनपुट से कैसे मेल खाता है. यह तब काम आता है, जब आपको ऊपर बताए गए Autocomplete और SearchBox की तुलना में, यूज़र इंटरफ़ेस पर ज़्यादा कंट्रोल चाहिए.

AutocompleteService इन तरीकों को दिखाता है:

• getPlacePredictions() जगह के बारे में अनुमानित जानकारी दिखाता है. ध्यान दें: Places API के मुताबिक, 'जगह' कोई प्रतिष्ठान, भौगोलिक जगह या लोकप्रिय जगह हो सकती है.
• getQueryPredictions() से अनुमानों की लंबी सूची मिलती है. इसमें Places API के हिसाब से तय की गई जगहों के साथ-साथ, खोज के लिए सुझाए गए शब्द भी शामिल हो सकते हैं. उदाहरण के लिए, अगर उपयोगकर्ता 'new में पिज़्ज़ा' डालता है, तो पिक लिस्ट में 'न्यूयॉर्क, न्यूयॉर्क में पिज़्ज़ा' वाक्यांश के साथ-साथ, पिज़्ज़ा आउटलेट के नाम भी शामिल हो सकते हैं.

ऊपर दिए गए दोनों तरीके, इस तरह के prediction objects का कलेक्शन दिखाते हैं:

• description, मैच किया गया अनुमान है.
• distance_meters, AutocompletionRequest.origin से जगह की दूरी को मीटर में दिखाता है.
• matched_substrings में जानकारी के तौर पर दी गई ऐसी सबस्ट्रिंग का सेट होता है जो उपयोगकर्ता के इनपुट में मौजूद एलिमेंट से मेल खाती हैं. यह सुविधा, आपके ऐप्लिकेशन में उन सबस्ट्रिंग को हाइलाइट करने के लिए काम की है. कई मामलों में, क्वेरी, जानकारी वाले फ़ील्ड के सबस्ट्रिंग के तौर पर दिखेगी.
  • length सबस्ट्रिंग की लंबाई है.
  • offset वर्ण ऑफ़सेट है. इसे जानकारी वाली स्ट्रिंग की शुरुआत से मापा जाता है. यह वह जगह होती है जहां मेल खाने वाली सबस्ट्रिंग दिखती है.
• place_id एक टेक्स्ट आइडेंटिफ़ायर है. इससे किसी जगह की खास पहचान की जाती है. जगह की जानकारी पाने के लिए, इस आइडेंटिफ़ायर को जगह की जानकारी पाने के अनुरोध के placeId फ़ील्ड में पास करें. जगह के आईडी की मदद से किसी जगह का रेफ़रंस देने के तरीके के बारे में ज़्यादा जानें.
• terms एक कैटगरी है, जिसमें क्वेरी के एलिमेंट शामिल होते हैं. किसी जगह के लिए, हर एलिमेंट आम तौर पर पते का एक हिस्सा होता है.
  • offset वर्ण ऑफ़सेट है. इसे जानकारी वाली स्ट्रिंग की शुरुआत से मापा जाता है. यह वह जगह होती है जहां मेल खाने वाली सबस्ट्रिंग दिखती है.
  • value, मैच करने वाला शब्द है.

यहां दिए गए उदाहरण में, 'मेरे आस-पास पिज़्ज़ा' वाक्यांश के लिए क्वेरी का अनुमान लगाने का अनुरोध किया गया है. साथ ही, नतीजे को सूची में दिखाया गया है.

// This example retrieves autocomplete predictions programmatically from the
// autocomplete service, and displays them as an HTML list.
// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">
function initService(): void {
  const displaySuggestions = function (
    predictions: google.maps.places.QueryAutocompletePrediction[] | null,
    status: google.maps.places.PlacesServiceStatus
  ) {
    if (status != google.maps.places.PlacesServiceStatus.OK || !predictions) {
      alert(status);
      return;
    }

    predictions.forEach((prediction) => {
      const li = document.createElement("li");

      li.appendChild(document.createTextNode(prediction.description));
      (document.getElementById("results") as HTMLUListElement).appendChild(li);
    });
  };

  const service = new google.maps.places.AutocompleteService();

  service.getQueryPredictions({ input: "pizza near Syd" }, displaySuggestions);
}

declare global {
  interface Window {
    initService: () => void;
  }
}
window.initService = initService;
index.ts

// This example retrieves autocomplete predictions programmatically from the
// autocomplete service, and displays them as an HTML list.
// This example requires the Places library. Include the libraries=places
// parameter when you first load the API. For example:
// <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places">
function initService() {
  const displaySuggestions = function (predictions, status) {
    if (status != google.maps.places.PlacesServiceStatus.OK || !predictions) {
      alert(status);
      return;
    }

    predictions.forEach((prediction) => {
      const li = document.createElement("li");

      li.appendChild(document.createTextNode(prediction.description));
      document.getElementById("results").appendChild(li);
    });
  };

  const service = new google.maps.places.AutocompleteService();

  service.getQueryPredictions({ input: "pizza near Syd" }, displaySuggestions);
}

window.initService = initService;
index.js

style.css

<html>
  <head>
    <title>Retrieving Autocomplete Predictions</title>

    <link rel="stylesheet" type="text/css" href="./style.css" />
    <script type="module" src="./index.js"></script>
  </head>
  <body>
    <p>Query suggestions for 'pizza near Syd':</p>
    <ul id="results"></ul>
    <!-- Replace Powered By Google image src with self hosted image. https://developers.google.com/maps/documentation/places/web-service/policies#other_attribution_requirements -->
    <img
      class="powered-by-google"
      src="https://storage.googleapis.com/geo-devrel-public-buckets/powered_by_google_on_white.png"
      alt="Powered by Google"
    />

    <!-- 
      The `defer` attribute causes the script to execute after the full HTML
      document has been parsed. For non-blocking uses, avoiding race conditions,
      and consistent behavior across browsers, consider loading using Promises. See
      https://developers.google.com/maps/documentation/javascript/load-maps-js-api
      for more information.
      -->
    <script
      src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB41DRUbKWJHPxaFjMAwdrzWzbVKartNGg&callback=initService&libraries=places&v=weekly"
      defer
    ></script>
  </body>
</html>
index.html

उदाहरण देखें

सेशन टोकन

AutocompleteService.getPlacePredictions(), बिलिंग के मकसद से अपने-आप पूरा होने वाले अनुरोधों को एक साथ ग्रुप करने के लिए, सेशन टोकन (अगर लागू किया गया है) का इस्तेमाल कर सकता है. सेशन टोकन, उपयोगकर्ता की अपने-आप पूरी होने वाली खोज के क्वेरी और चुनने के चरणों को बिलिंग के लिए अलग-अलग सेशन में ग्रुप करते हैं. सेशन तब शुरू होता है, जब उपयोगकर्ता कोई क्वेरी टाइप करना शुरू करता है. यह तब खत्म होता है, जब वह कोई जगह चुन लेता है. हर सेशन में कई क्वेरी हो सकती हैं. इसके बाद, एक जगह चुनी जाती है. सेशन खत्म होने के बाद, टोकन मान्य नहीं रहता. आपके ऐप्लिकेशन को हर सेशन के लिए, नया टोकन जनरेट करना होगा. हमारा सुझाव है कि सभी ऑटोमैटिक भरने वाले सेशन के लिए, सेशन टोकन का इस्तेमाल करें. अगर sessionToken पैरामीटर शामिल नहीं किया जाता है या सेशन टोकन का दोबारा इस्तेमाल किया जाता है, तो सेशन के लिए उसी तरह शुल्क लिया जाता है जैसे सेशन टोकन नहीं दिया गया था. इसका मतलब है कि हर अनुरोध के लिए अलग से बिल भेजा जाता है.

AutocompleteService.getPlacePredictions() को कॉल करने पर मिले नतीजे में मौजूद जगह के लिए, एक जगह की जानकारी पाने का अनुरोध करने के लिए, इसी सेशन टोकन का इस्तेमाल किया जा सकता है. इस मामले में, अपने-आप पूरा होने के अनुरोध को जगह की जानकारी के अनुरोध के साथ जोड़ दिया जाता है. साथ ही, कॉल के लिए जगह की जानकारी के सामान्य अनुरोध के तौर पर शुल्क लिया जाता है. ऑटोकंप्लीट के अनुरोध के लिए कोई शुल्क नहीं लिया जाता.

पक्का करें कि हर नए सेशन के लिए, एक यूनीक सेशन टोकन पास किया गया हो. एक से ज़्यादा ऑटोकंप्लीट सेशन के लिए एक ही टोकन का इस्तेमाल करने पर, वे ऑटोकंप्लीट सेशन अमान्य हो जाएंगे. साथ ही, अमान्य सेशन में किए गए सभी ऑटोकंप्लीट अनुरोधों के लिए, हर अनुरोध के लिए ऑटोकंप्लीट एसकेयू का इस्तेमाल करके अलग-अलग शुल्क लिया जाएगा. सेशन टोकन के बारे में ज़्यादा जानें.

यहां दिए गए उदाहरण में, सेशन टोकन बनाने और फिर उसे AutocompleteService में पास करने का तरीका दिखाया गया है. displaySuggestions() फ़ंक्शन को छोटा रखने के लिए, इसे शामिल नहीं किया गया है:

// Create a new session token.
var sessionToken = new google.maps.places.AutocompleteSessionToken();

// Pass the token to the autocomplete service.
var autocompleteService = new google.maps.places.AutocompleteService();
autocompleteService.getPlacePredictions({
  input: 'pizza near Syd',
  sessionToken: sessionToken
},
displaySuggestions);

पक्का करें कि हर नए सेशन के लिए, एक यूनीक सेशन टोकन पास किया गया हो. एक से ज़्यादा सेशन के लिए एक ही टोकन का इस्तेमाल करने पर, हर अनुरोध के लिए अलग से बिल भेजा जाएगा.

सेशन टोकन के बारे में ज़्यादा जानें.

Autocomplete और SearchBox विजेट की स्टाइल बदलना

डिफ़ॉल्ट रूप से, Autocomplete और SearchBox से मिले यूज़र इंटरफ़ेस (यूआई) एलिमेंट को Google मैप पर शामिल करने के लिए स्टाइल किया जाता है. अपनी साइट के हिसाब से स्टाइल में बदलाव किया जा सकता है. ये सीएसएस क्लास उपलब्ध हैं. नीचे दी गई सभी क्लास, Autocomplete और SearchBox, दोनों विजेट पर लागू होती हैं.

जगह के नाम के शुरुआती अक्षर लिखने पर पूरा नाम सुझाने की सुविधा (लेगसी) को ऑप्टिमाइज़ करना

इस सेक्शन में, Place Autocomplete (लेगसी) सेवा का ज़्यादा से ज़्यादा फ़ायदा पाने के लिए, सबसे सही तरीकों के बारे में बताया गया है.

यहां कुछ सामान्य दिशा-निर्देश दिए गए हैं:

• उपयोगकर्ता इंटरफ़ेस को तेज़ी से डेवलप करने के लिए, Maps JavaScript API जगह की जानकारी अपने-आप भरने की सुविधा (लेगसी) वाला विजेट, Places SDK for Android जगह की जानकारी अपने-आप भरने की सुविधा (लेगसी) वाला विजेट या Places SDK for iOS जगह की जानकारी अपने-आप भरने की सुविधा (लेगसी) वाला यूज़र इंटरफ़ेस कंट्रोल का इस्तेमाल करें
• शुरू से ही, Place Autocomplete (लेगसी) के ज़रूरी डेटा फ़ील्ड के बारे में जानकारी पाएं.
• जगह के हिसाब से खोज के नतीजों को प्राथमिकता देने और जगह के हिसाब से पाबंदी लगाने वाले फ़ील्ड का इस्तेमाल करना ज़रूरी नहीं है. हालांकि, इससे अपने-आप भरने की सुविधा की परफ़ॉर्मेंस पर काफ़ी असर पड़ सकता है.
• गड़बड़ी को मैनेज करने की सुविधा का इस्तेमाल करें, ताकि एपीआई से गड़बड़ी का मैसेज मिलने पर आपका ऐप्लिकेशन ठीक से काम करे.
• पक्का करें कि आपके ऐप्लिकेशन में, बिना कोई विकल्प चुने आगे बढ़ने की सुविधा हो.

लागत को ऑप्टिमाइज़ करने के सबसे सही तरीके

लागत को ऑप्टिमाइज़ करने की बुनियादी सेटिंग

Place Autocomplete (लेगसी) सेवा का इस्तेमाल करने की लागत को कम करने के लिए, Place Details (लेगसी) और Place Autocomplete (लेगसी) विजेट में फ़ील्ड मास्क का इस्तेमाल करें. इससे आपको सिर्फ़ वे जगह की जानकारी वाले फ़ील्ड मिलेंगे जिनकी आपको ज़रूरत है.

लागत को ऑप्टिमाइज़ करने की बेहतर सुविधा

हर अनुरोध के लिए कीमत को ऐक्सेस करने के लिए, Place Autocomplete (लेगसी) को प्रोग्राम के हिसाब से लागू करें. साथ ही, Place Details (लेगसी) के बजाय, चुनी गई जगह के बारे में Geocoding API के नतीजे पाने का अनुरोध करें. अगर ये दोनों शर्तें पूरी होती हैं, तो हर अनुरोध के हिसाब से तय की गई कीमत, हर सेशन (सेशन के आधार पर) के हिसाब से तय की गई कीमत से ज़्यादा किफ़ायती होती है:

• अगर आपको सिर्फ़ उपयोगकर्ता की चुनी गई जगह का अक्षांश/देशांतर या पता चाहिए, तो Geocoding API, Place Details (लेगसी) API के कॉल की तुलना में कम समय में यह जानकारी उपलब्ध कराता है.
• अगर उपयोगकर्ता, Place Autocomplete (लेगसी) के औसतन चार या इससे कम सुझावों के अनुरोधों में से किसी एक को चुनते हैं, तो अनुरोध के हिसाब से तय की गई कीमत, सेशन के हिसाब से तय की गई कीमत से ज़्यादा किफ़ायती हो सकती है.

क्या आपके ऐप्लिकेशन को चुने गए अनुमान के पते और अक्षांश/देशांतर के अलावा किसी अन्य जानकारी की ज़रूरत है?

परफ़ॉर्मेंस के सबसे सही तरीके

यहां दिए गए दिशा-निर्देशों में, Place Autocomplete (लेगसी) की परफ़ॉर्मेंस को ऑप्टिमाइज़ करने के तरीके बताए गए हैं:

• अपने Place Autocomplete (Legacy) को लागू करने के लिए, देश के हिसाब से पाबंदियां, जगह के हिसाब से नतीजे दिखाने की सुविधा, और (प्रोग्राम के हिसाब से लागू करने के लिए) भाषा की प्राथमिकता जोड़ें. विजेट के लिए भाषा की प्राथमिकता सेट करने की ज़रूरत नहीं होती, क्योंकि वे उपयोगकर्ता के ब्राउज़र या मोबाइल डिवाइस से भाषा की प्राथमिकताएं चुनते हैं.
• अगर जगह की जानकारी अपने-आप भरने की सुविधा (लेगसी) के साथ मैप मौजूद है, तो मैप व्यूपोर्ट के हिसाब से जगह की जानकारी को प्राथमिकता दी जा सकती है.
• जब कोई उपयोगकर्ता, जगह के नाम अपने-आप भरने की सुविधा (लेगसी) के तहत मिले सुझावों में से किसी एक को नहीं चुनता है, तो आम तौर पर ऐसा इसलिए होता है, क्योंकि इनमें से कोई भी सुझाव, खोज के लिए डाले गए पते से मेल नहीं खाता. ऐसे में, ज़्यादा काम के नतीजे पाने के लिए, उपयोगकर्ता के ओरिजनल इनपुट का फिर से इस्तेमाल किया जा सकता है:
  • अगर आपको लगता है कि उपयोगकर्ता सिर्फ़ पते की जानकारी डालेगा, तो Geocoding API को कॉल करने के लिए, उपयोगकर्ता के ओरिजनल इनपुट का फिर से इस्तेमाल करें.
  • अगर आपको लगता है कि उपयोगकर्ता किसी जगह का नाम या पता डालकर क्वेरी करेगा, तो जगह ढूंढने का अनुरोध (लेगसी) का इस्तेमाल करें. अगर आपको नतीजे सिर्फ़ किसी खास इलाके में चाहिए, तो जगह के हिसाब से खोज के नतीजों को प्राथमिकता देने की सुविधा का इस्तेमाल करें.
  ऐसे अन्य उदाहरणों में Geocoding API का इस्तेमाल करना सबसे सही होता है:
  • ऐसे उपयोगकर्ता जो सबप्रीमाइज़ के पते डालते हैं. जैसे, किसी बिल्डिंग में मौजूद खास यूनिट या अपार्टमेंट के पते. उदाहरण के लिए, चेक गणराज्य के पते "Stroupežnického 3191/17, Praha" के लिए, Place Autocomplete (लेगसी) में आंशिक सुझाव मिलता है.
  • ऐसे उपयोगकर्ता जो न्यूयॉर्क शहर में "23-30 29th St, Queens" या हवाई के काउआई द्वीप पर "47-380 Kamehameha Hwy, Kaneohe" जैसे सड़क-सेगमेंट के प्रीफ़िक्स वाले पते डालते हैं.

इस्तेमाल करने की सीमा

कोटा

कोटा और कीमत की जानकारी के लिए, Places API के इस्तेमाल और बिलिंग से जुड़ा दस्तावेज़ देखें.