PlaceAutocompleteElement क्लास
google.maps.places.PlaceAutocompleteElement
क्लास
PlaceAutocompleteElement, HTMLElement
सबक्लास है. यह Places Autocomplete API के लिए यूज़र इंटरफ़ेस (यूआई) कॉम्पोनेंट उपलब्ध कराता है.
PlaceAutocompleteElement, उपयोगकर्ता की ऑटोकंप्लीट खोज के क्वेरी और चुनने के चरणों को ग्रुप करने के लिए, AutocompleteSessionToken
s का इस्तेमाल अपने-आप करता है.
PlacePrediction.toPlace
से मिले Place
पर Place.fetchFields
को किया गया पहला कॉल, PlacePrediction
को फ़ेच करने के लिए इस्तेमाल किए गए सेशन टोकन को अपने-आप शामिल कर लेगा.
सेशन के काम करने के तरीके के बारे में ज़्यादा जानने के लिए, https://developers.google.com/maps/documentation/places/web-service/place-session-tokens पर जाएं.
कस्टम एलिमेंट:
<gmp-place-autocomplete included-primary-types="type1 type2 type3..." included-region-codes="c1 c2 c3..." name="string" origin="lat,lng" requested-language="string" requested-region="string" unit-system="metric"></gmp-place-autocomplete>
यह क्लास HTMLElement
तक चलेगी.
यह क्लास PlaceAutocompleteElementOptions
को लागू करती है.
const {PlaceAutocompleteElement} = await google.maps.importLibrary("places")
पर कॉल करके ऐक्सेस करें.
Maps JavaScript API में मौजूद लाइब्रेरी देखें.
निर्माता | |
---|---|
PlaceAutocompleteElement |
PlaceAutocompleteElement(options) पैरामीटर:
|
प्रॉपर्टी | |
---|---|
includedPrimaryTypes |
टाइप:
Array<string> optional इसमें प्राइमरी जगह का टाइप शामिल होता है. उदाहरण के लिए, "restaurant" या "gas_station".
किसी जगह की जानकारी सिर्फ़ तब दिखाई जाती है, जब उसका मुख्य टाइप इस सूची में शामिल हो. ज़्यादा से ज़्यादा पांच वैल्यू दी जा सकती हैं. अगर कोई टाइप नहीं दिया गया है, तो सभी Place टाइप दिखाए जाते हैं. एचटीएमएल एट्रिब्यूट:
|
includedRegionCodes |
टाइप:
Array<string> optional सिर्फ़ उन क्षेत्रों के नतीजे शामिल करें जिनके लिए, ज़्यादा से ज़्यादा 15 CLDR दो-वर्ण वाले क्षेत्र के कोड दिए गए हैं. खाली सेट होने पर, नतीजों पर कोई पाबंदी नहीं लगेगी. अगर
locationRestriction और includedRegionCodes , दोनों सेट किए जाते हैं, तो नतीजे इंटरसेक्शन वाले इलाके में दिखेंगे.एचटीएमएल एट्रिब्यूट:
|
locationBias |
टाइप:
LocationBias optional जगहें खोजते समय इस्तेमाल करने के लिए, एक सॉफ्ट बाउंड्री या हिंट. |
locationRestriction |
टाइप:
LocationRestriction optional खोज के नतीजों को सीमित करने के लिए सीमाएं. |
name |
टाइप:
string optional इनपुट एलिमेंट के लिए इस्तेमाल किया जाने वाला नाम. ज़्यादा जानकारी के लिए, https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#name पर जाएं. यह इनपुट के लिए, नाम एट्रिब्यूट की तरह ही काम करता है. ध्यान दें कि फ़ॉर्म सबमिट करते समय इसी नाम का इस्तेमाल किया जाएगा. ज़्यादा जानकारी के लिए, https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form पर जाएं.
एचटीएमएल एट्रिब्यूट:
|
origin |
टाइप:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional वह जगह जहां से दूरी का हिसाब लगाना है. अगर यह जानकारी नहीं दी जाती है, तो दूरी का हिसाब नहीं लगाया जाता. अगर ऊंचाई की जानकारी दी गई है, तो उसे कैलकुलेशन में इस्तेमाल नहीं किया जाता.
एचटीएमएल एट्रिब्यूट:
|
requestedLanguage |
टाइप:
string optional अगर हो सके, तो उस भाषा के लिए आइडेंटिफ़ायर जिसमें नतीजे दिखाए जाने चाहिए. चुनी गई भाषा में मिले नतीजों को बेहतर रैंकिंग दी जा सकती है. हालांकि, सुझाव सिर्फ़ इसी भाषा में नहीं दिए जाते. इस्तेमाल की जा सकने वाली भाषाओं की सूची देखें.
एचटीएमएल एट्रिब्यूट:
|
requestedRegion |
टाइप:
string optional यह एक क्षेत्र का कोड होता है. इसका इस्तेमाल, नतीजों को फ़ॉर्मैट करने और उन्हें फ़िल्टर करने के लिए किया जाता है. इससे इस देश के लिए सुझावों को सीमित नहीं किया जाता. क्षेत्र के कोड में, दो वर्णों वाली ccTLD ("टॉप-लेवल डोमेन") वैल्यू डाली जा सकती है. ज़्यादातर ccTLD कोड, ISO 3166-1 कोड के जैसे ही होते हैं. हालांकि, कुछ अपवाद भी हैं. उदाहरण के लिए, यूनाइटेड किंगडम का ccTLD "uk" (
.co.uk ) है, जबकि इसका ISO 3166-1 कोड "gb" है. तकनीकी तौर पर, यह "ग्रेट ब्रिटेन और उत्तरी आयरलैंड का यूनाइटेड किंगडम" के लिए है.एचटीएमएल एट्रिब्यूट:
|
unitSystem |
टाइप:
UnitSystem optional दूरी दिखाने के लिए इस्तेमाल किया जाने वाला यूनिट सिस्टम. अगर इसे तय नहीं किया जाता है, तो यूनिट सिस्टम का पता requestedRegion से लगाया जाता है.
एचटीएमएल एट्रिब्यूट:
|
पुर्ज़े | |
---|---|
prediction-item |
सुझावों के ड्रॉप-डाउन में मौजूद एक आइटम, जो एक सुझाव को दिखाता है. |
prediction-item-icon |
अनुमानों की सूची में, हर आइटम के बाईं ओर दिखने वाला आइकॉन. |
prediction-item-main-text |
यह prediction-item का एक हिस्सा है. यह अनुमान का मुख्य टेक्स्ट होता है. भौगोलिक जगहों के लिए, इसमें जगह का नाम होता है. जैसे, 'सिडनी'. इसके अलावा, इसमें सड़क का नाम और नंबर भी होता है. जैसे, '10 किंग स्ट्रीट'. डिफ़ॉल्ट रूप से, prediction-item-main-text का रंग काला होता है. अगर सुझाव वाले आइटम में कोई और टेक्स्ट है, तो वह prediction-item-main-text से बाहर होता है. साथ ही, वह prediction-item से अपनी स्टाइल इनहेरिट करता है. यह डिफ़ॉल्ट रूप से स्लेटी रंग का होता है. अतिरिक्त टेक्स्ट आम तौर पर पता होता है. |
prediction-item-match |
जवाब में शामिल वह हिस्सा जो उपयोगकर्ता के इनपुट से मेल खाता है. डिफ़ॉल्ट रूप से, मैच किए गए इस टेक्स्ट को बोल्ड टेक्स्ट में हाइलाइट किया जाता है. ध्यान दें कि मैच किया गया टेक्स्ट, prediction-item में कहीं भी हो सकता है. यह ज़रूरी नहीं है कि prediction-item-main-text का हिस्सा हो. |
prediction-item-selected |
जब उपयोगकर्ता कीबोर्ड के ज़रिए किसी आइटम पर जाता है. ध्यान दें: चुने गए आइटम पर, इस पार्ट स्टाइल और अनुमानित आइटम की पार्ट स्टाइल, दोनों का असर पड़ेगा. |
prediction-list |
यह विज़ुअल एलिमेंट है. इसमें Place Autocomplete सेवा से मिले सुझावों की सूची होती है. यह सूची, PlaceAutocompleteElement के नीचे ड्रॉपडाउन सूची के तौर पर दिखती है. |
तरीके | |
---|---|
|
addEventListener(type, listener[, options]) पैरामीटर:
लौटाई गई वैल्यू:
void यह कुकी एक फ़ंक्शन सेट अप करती है. इस फ़ंक्शन को तब कॉल किया जाता है, जब टारगेट को तय किया गया इवेंट डिलीवर किया जाता है. addEventListener देखें. |
|
removeEventListener(type, listener[, options]) पैरामीटर:
लौटाई गई वैल्यू:
void यह फ़ंक्शन, टारगेट से उस इवेंट लिसनर को हटाता है जिसे addEventListener के साथ रजिस्टर किया गया था. removeEventListener देखें. |
इवेंट | |
---|---|
gmp-error |
function(errorEvent) आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब बैकएंड से किया गया अनुरोध अस्वीकार कर दिया जाता है. उदाहरण के लिए, एपीआई कुंजी गलत होने पर. यह इवेंट बब्ल नहीं होता है. |
gmp-select |
function(placePredictionSelectEvent) आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब कोई उपयोगकर्ता जगह के बारे में अनुमानित जानकारी चुनता है. इसमें PlacePrediction ऑब्जेक्ट होता है, जिसे Place ऑब्जेक्ट में बदला जा सकता है. |
PlaceAutocompleteElementOptions इंटरफ़ेस
google.maps.places.PlaceAutocompleteElementOptions
इंटरफ़ेस
PlaceAutocompleteElement बनाने के विकल्प. हर प्रॉपर्टी के ब्यौरे के लिए, PlaceAutocompleteElement क्लास में उसी नाम की प्रॉपर्टी देखें.
प्रॉपर्टी | |
---|---|
locationBias optional |
टाइप:
LocationBias optional |
locationRestriction optional |
टाइप:
LocationRestriction optional |
name optional |
टाइप:
string optional |
requestedLanguage optional |
टाइप:
string optional |
PlacePredictionSelectEvent क्लास
google.maps.places.PlacePredictionSelectEvent
क्लास
यह इवेंट तब बनाया जाता है, जब उपयोगकर्ता PlaceAutocompleteElement की मदद से, अनुमानित जगह का कोई आइटम चुनता है. event.placePrediction
की मदद से, चुने गए आइटम को ऐक्सेस करें.
PlacePrediction.toPlace
को कॉल करके, placePrediction को Place
में बदलें.
यह क्लास Event
तक चलेगी.
const {PlacePredictionSelectEvent} = await google.maps.importLibrary("places")
पर कॉल करके ऐक्सेस करें.
Maps JavaScript API में मौजूद लाइब्रेरी देखें.
प्रॉपर्टी | |
---|---|
placePrediction |
टाइप:
PlacePrediction इसे PlacePrediction.toPlace पर कॉल करके Place में बदलें. |
PlaceAutocompleteRequestErrorEvent क्लास
google.maps.places.PlaceAutocompleteRequestErrorEvent
क्लास
नेटवर्क अनुरोध में कोई समस्या होने पर, PlaceAutocompleteElement इस इवेंट को ट्रिगर करता है.
यह क्लास Event
तक चलेगी.
const {PlaceAutocompleteRequestErrorEvent} = await google.maps.importLibrary("places")
पर कॉल करके ऐक्सेस करें.
Maps JavaScript API में मौजूद लाइब्रेरी देखें.
PlaceContextualElement क्लास
google.maps.places.PlaceContextualElement
क्लास
यह एक ऐसा विजेट है जो कॉन्टेक्स्ट टोकन का इस्तेमाल करके, Google Maps से मिले जवाब के कॉन्टेक्स्ट के हिसाब से व्यू दिखाता है.
कस्टम एलिमेंट:
<gmp-place-contextual context-token="string"></gmp-place-contextual>
यह क्लास HTMLElement
तक चलेगी.
यह क्लास PlaceContextualElementOptions
को लागू करती है.
const {PlaceContextualElement} = await google.maps.importLibrary("places")
पर कॉल करके ऐक्सेस करें.
Maps JavaScript API में मौजूद लाइब्रेरी देखें.
प्रॉपर्टी | |
---|---|
contextToken |
टाइप:
string optional कॉन्टेक्स्ट टोकन.
एचटीएमएल एट्रिब्यूट:
|
तरीके | |
---|---|
|
addEventListener(type, listener[, options]) पैरामीटर:
लौटाई गई वैल्यू:
void यह कुकी एक फ़ंक्शन सेट अप करती है. इस फ़ंक्शन को तब कॉल किया जाता है, जब टारगेट को तय किया गया इवेंट डिलीवर किया जाता है. addEventListener देखें. |
|
removeEventListener(type, listener[, options]) पैरामीटर:
लौटाई गई वैल्यू:
void यह फ़ंक्शन, टारगेट से उस इवेंट लिसनर को हटाता है जिसे addEventListener के साथ रजिस्टर किया गया था. removeEventListener देखें. |
PlaceContextualElementOptions इंटरफ़ेस
google.maps.places.PlaceContextualElementOptions
इंटरफ़ेस
PlaceContextualElement
के लिए विकल्प.
प्रॉपर्टी | |
---|---|
contextToken optional |
टाइप:
string optional यह कॉन्टेक्स्ट टोकन, 'Google Maps से जानकारी लेना' सुविधा के जवाब से मिलता है. |
PlaceContextualListConfigElement class
google.maps.places.PlaceContextualListConfigElement
क्लास
यह एक एचटीएमएल एलिमेंट है. यह प्लेस कॉन्टेक्स्टुअल एलिमेंट के लिस्ट व्यू के लिए विकल्पों को कॉन्फ़िगर करता है.
कस्टम एलिमेंट:
<gmp-place-contextual-list-config layout="compact" map-hidden></gmp-place-contextual-list-config>
यह क्लास HTMLElement
तक चलेगी.
यह क्लास PlaceContextualListConfigElementOptions
को लागू करती है.
const {PlaceContextualListConfigElement} = await google.maps.importLibrary("places")
पर कॉल करके ऐक्सेस करें.
Maps JavaScript API में मौजूद लाइब्रेरी देखें.
प्रॉपर्टी | |
---|---|
layout |
टाइप:
PlaceContextualListLayout optional लेआउट.
एचटीएमएल एट्रिब्यूट:
|
mapHidden |
टाइप:
boolean optional क्या मैप को छिपाया गया है.
एचटीएमएल एट्रिब्यूट:
|
तरीके | |
---|---|
|
addEventListener(type, listener[, options]) पैरामीटर:
लौटाई गई वैल्यू:
void यह कुकी एक फ़ंक्शन सेट अप करती है. इस फ़ंक्शन को तब कॉल किया जाता है, जब टारगेट को तय किया गया इवेंट डिलीवर किया जाता है. addEventListener देखें. |
|
removeEventListener(type, listener[, options]) पैरामीटर:
लौटाई गई वैल्यू:
void यह फ़ंक्शन, टारगेट से उस इवेंट लिसनर को हटाता है जिसे addEventListener के साथ रजिस्टर किया गया था. removeEventListener देखें. |
PlaceContextualListConfigElementOptions इंटरफ़ेस
google.maps.places.PlaceContextualListConfigElementOptions
इंटरफ़ेस
PlaceContextualListConfigElement के लिए विकल्प.
प्रॉपर्टी | |
---|---|
layout optional |
टाइप:
PlaceContextualListLayout optional लेआउट. डिफ़ॉल्ट वैल्यू PlaceContextualListLayout.VERTICAL है. |
mapHidden optional |
टाइप:
boolean optional क्या मैप को छिपाया गया है. डिफ़ॉल्ट रूप से, मैप दिखाने का विकल्प चालू होता है (वैल्यू false). |
PlaceContextualListLayout कॉन्स्टेंट
google.maps.places.PlaceContextualListLayout
कॉन्स्टेंट
उन लेआउट की सूची जिन्हें सूची वाले व्यू के लिए, जगह के हिसाब से कॉन्टेक्स्ट देने वाला एलिमेंट इस्तेमाल कर सकता है.
const {PlaceContextualListLayout} = await google.maps.importLibrary("places")
पर कॉल करके ऐक्सेस करें.
Maps JavaScript API में मौजूद लाइब्रेरी देखें.
कॉन्स्टेंट | |
---|---|
COMPACT |
कॉम्पैक्ट लिस्ट लेआउट: इसमें लिस्ट आइटम को एक लाइन में लिंक के तौर पर रेंडर किया जाता है. साथ ही, ज़्यादा आइटम को ड्रॉपडाउन लिस्ट में दिखाया जाता है. |
VERTICAL |
वर्टिकल लिस्ट लेआउट: लिस्ट आइटम को वर्टिकल लिस्ट में कार्ड के तौर पर रेंडर किया जाता है. |
PlaceDetailsElement class
google.maps.places.PlaceDetailsElement
क्लास
यह एक एचटीएमएल एलिमेंट है, जो किसी जगह की जानकारी दिखाता है. रेंडर किए जाने वाले कॉन्टेंट के बारे में बताने के लिए, configureFromPlace()
या configureFromLocation()
तरीकों का इस्तेमाल करें. जगह की जानकारी देने वाले एलिमेंट का इस्तेमाल करने के लिए, Google Cloud Console में अपने प्रोजेक्ट के लिए Places UI Kit API चालू करें.
कस्टम एलिमेंट:
<gmp-place-details size="small"></gmp-place-details>
यह क्लास HTMLElement
तक चलेगी.
यह क्लास PlaceDetailsElementOptions
को लागू करती है.
const {PlaceDetailsElement} = await google.maps.importLibrary("places")
पर कॉल करके ऐक्सेस करें.
Maps JavaScript API में मौजूद लाइब्रेरी देखें.
निर्माता | |
---|---|
PlaceDetailsElement |
PlaceDetailsElement([options]) पैरामीटर:
|
प्रॉपर्टी | |
---|---|
place |
टाइप:
Place optional सिर्फ़ पढ़ने के लिए. Place ऑब्जेक्ट में, आईडी, जगह की जानकारी, और मौजूदा रेंडर की गई जगह का व्यूपोर्ट शामिल होता है. |
size |
टाइप:
PlaceDetailsSize optional PlaceDetailsElement का साइज़ वैरिएंट. डिफ़ॉल्ट रूप से, एलिमेंट
PlaceDetailsSize.X_LARGE दिखाएगा.एचटीएमएल एट्रिब्यूट:
|
तरीके | |
---|---|
|
addEventListener(type, listener[, options]) पैरामीटर:
लौटाई गई वैल्यू:
void यह कुकी एक फ़ंक्शन सेट अप करती है. इस फ़ंक्शन को तब कॉल किया जाता है, जब टारगेट को तय किया गया इवेंट डिलीवर किया जाता है. addEventListener देखें. |
configureFromLocation |
configureFromLocation(location) पैरामीटर:
लौटाई गई वैल्यू:
Promise<void> यह एक प्रॉमिस है. जगह की जानकारी का डेटा लोड होने और रेंडर होने के बाद, यह प्रॉमिस पूरा हो जाता है.रिवर्स जियोकोडिंग का इस्तेमाल करके, LatLng से विजेट को कॉन्फ़िगर करता है. |
configureFromPlace |
configureFromPlace(place) पैरामीटर:
लौटाई गई वैल्यू:
Promise<void> यह एक प्रॉमिस है. जगह की जानकारी का डेटा लोड होने और रेंडर होने के बाद, यह प्रॉमिस पूरा हो जाता है.यह Place ऑब्जेक्ट या जगह के आईडी से विजेट को कॉन्फ़िगर करता है. |
|
removeEventListener(type, listener[, options]) पैरामीटर:
लौटाई गई वैल्यू:
void यह फ़ंक्शन, टारगेट से उस इवेंट लिसनर को हटाता है जिसे addEventListener के साथ रजिस्टर किया गया था. removeEventListener देखें. |
इवेंट | |
---|---|
gmp-load |
function(event) आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब एलिमेंट लोड होता है और उसका कॉन्टेंट रेंडर होता है. यह इवेंट बब्ल नहीं होता है. |
gmp-requesterror |
function(event) आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब बैकएंड से किया गया अनुरोध अस्वीकार कर दिया जाता है. उदाहरण के लिए, एपीआई कुंजी गलत होने पर. यह इवेंट बब्ल नहीं होता है. |
PlaceDetailsElementOptions इंटरफ़ेस
google.maps.places.PlaceDetailsElementOptions
इंटरफ़ेस
PlaceDetailsElement
के लिए विकल्प.
प्रॉपर्टी | |
---|---|
size optional |
टाइप:
PlaceDetailsSize optional PlaceDetailsElement.size देखें |
PlaceDetailsSize कॉन्स्टेंट
google.maps.places.PlaceDetailsSize
कॉन्स्टेंट
PlaceDetailsElement
के लिए साइज़ वैरिएंट.
const {PlaceDetailsSize} = await google.maps.importLibrary("places")
पर कॉल करके ऐक्सेस करें.
Maps JavaScript API में मौजूद लाइब्रेरी देखें.
कॉन्स्टेंट | |
---|---|
LARGE |
बड़ा वैरिएंट. इसमें बड़ी इमेज, बुनियादी जानकारी, और संपर्क जानकारी शामिल होती है. |
MEDIUM |
मीडियम साइज़ वाला वर्शन, जिसमें बड़ी इमेज और बुनियादी जानकारी शामिल होती है. |
SMALL |
छोटा वैरिएंट, जिसमें छोटी इमेज और बुनियादी जानकारी शामिल होती है. |
X_LARGE |
ज़्यादा बड़ा वैरिएंट, जिसमें फ़ोटो कोलाज, समीक्षाएं, और जगह की पूरी जानकारी शामिल होती है. |
PlaceDetailsCompactElement class
google.maps.places.PlaceDetailsCompactElement
क्लास
यह किसी जगह की जानकारी को छोटे लेआउट में दिखाता है. रेंडर की जाने वाली जगह के बारे में बताने के लिए, PlaceDetailsPlaceRequestElement
जोड़ें. यह तय करने के लिए कि कौनसा कॉन्टेंट रेंडर करना है, PlaceContentConfigElement
, PlaceStandardContentElement
या PlaceAllContentElement
जोड़ें.
इस एलिमेंट का इस्तेमाल करने के लिए, Google Cloud Console में अपने प्रोजेक्ट के लिए Places UI Kit API चालू करें.
कस्टम एलिमेंट:
<gmp-place-details-compact orientation="vertical" truncation-preferred></gmp-place-details-compact>
यह क्लास HTMLElement
तक चलेगी.
यह क्लास PlaceDetailsCompactElementOptions
को लागू करती है.
const {PlaceDetailsCompactElement} = await google.maps.importLibrary("places")
पर कॉल करके ऐक्सेस करें.
Maps JavaScript API में मौजूद लाइब्रेरी देखें.
निर्माता | |
---|---|
PlaceDetailsCompactElement |
PlaceDetailsCompactElement([options]) पैरामीटर:
|
प्रॉपर्टी | |
---|---|
orientation |
टाइप:
PlaceDetailsOrientation optional डिफ़ॉल्ट:
PlaceDetailsOrientation.VERTICAL एलिमेंट का ओरिएंटेशन वैरिएंट (वर्टिकल या हॉरिज़ॉन्टल).
एचटीएमएल एट्रिब्यूट:
|
place |
टाइप:
Place optional सिर्फ़ पढ़ने के लिए. जगह की जानकारी वाला ऑब्जेक्ट, जिसमें आईडी, जगह की जानकारी, और मौजूदा समय में रेंडर की गई जगह का व्यूपोर्ट शामिल होता है. |
truncationPreferred |
टाइप:
boolean डिफ़ॉल्ट:
false अगर यह वैल्यू सही है, तो जगह के नाम और पते को रैप करने के बजाय, एक लाइन में फ़िट करने के लिए छोटा कर दिया जाता है.
एचटीएमएल एट्रिब्यूट:
|
सीएसएस प्रॉपर्टी | |
---|---|
|