AdvancedMarkerElement क्लास
class
google.maps.marker.AdvancedMarkerElement
extends HTMLElement
implements AdvancedMarkerElementOptions
library "marker"
मैप पर कोई जगह दिखाता है. ध्यान दें कि AdvancedMarkerElement को दिखाने के लिए, position को सेट करना ज़रूरी है.
<gmp-advanced-marker anchor-left="string" anchor-top="string" gmp-clickable position="lat,lng" title="string"> </gmp-advanced-marker>
const {AdvancedMarkerElement} = await google.maps.importLibrary("marker");
निर्माता | |
|---|---|
AdvancedMarkerElement |
AdvancedMarkerElement([options])पैरामीटर:
तय किए गए विकल्पों के साथ AdvancedMarkerElement बनाता है. अगर कोई मैप तय किया गया है, तो AdvancedMarkerElement को मैप पर जोड़ दिया जाता है. |
प्रॉपर्टी | |
|---|---|
anchorLeft
attr: anchor-left |
टाइप:
string optionalडिफ़ॉल्ट: "-50%"
सीएसएस लेंथ-परसेंटेज वैल्यू, जिसका इस्तेमाल मार्कर के ऐंकर पॉइंट को मार्कर के सबसे ऊपर बाएं कोने से ऑफ़सेट करने के लिए किया जाता है. यह तब काम आता है, जब किसी ऐसे विज़ुअल का इस्तेमाल किया जा रहा हो जिसका ऐंकर पॉइंट, डिफ़ॉल्ट मार्कर के सामान्य बॉटम सेंटर पॉइंट से अलग हो.
एचटीएमएल एट्रिब्यूट: anchor-left="string" |
anchorTop
attr: anchor-top |
टाइप:
string optionalडिफ़ॉल्ट: "-100%"
सीएसएस लेंथ-परसेंटेज वैल्यू, जिसका इस्तेमाल मार्कर के ऐंकर पॉइंट को मार्कर के सबसे ऊपर बाएं कोने से ऑफ़सेट करने के लिए किया जाता है. यह तब काम आता है, जब किसी ऐसे विज़ुअल का इस्तेमाल किया जा रहा हो जिसका ऐंकर पॉइंट, डिफ़ॉल्ट मार्कर के सामान्य बॉटम सेंटर पॉइंट से अलग हो.
एचटीएमएल एट्रिब्यूट: anchor-top="string" |
collisionBehavior |
टाइप:
CollisionBehavior optional |
gmpClickable
attr: gmp-clickable |
टाइप:
boolean optionalएचटीएमएल एट्रिब्यूट: gmp-clickable |
gmpDraggable |
टाइप:
boolean optional |
map |
टाइप:
Map optional |
position
attr: position |
टाइप:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalएचटीएमएल एट्रिब्यूट:
|
title
attr: title |
टाइप:
stringएचटीएमएल एट्रिब्यूट: title="string" |
zIndex |
टाइप:
number optional |
readonly |
टाइप:
HTMLElementइस फ़ील्ड को सिर्फ़ पढ़ा जा सकता है. व्यू को सपोर्ट करने वाला डीओएम एलिमेंट. |
|
टाइप:
Node optional |
तरीके | |
|---|---|
|
addListener(eventName, handler)पैरामीटर:
रिटर्न वैल्यू:
MapsEventListener इवेंट लिसनर.यह Maps इवेंटिंग सिस्टम में, दिए गए इवेंट के नाम में दिए गए लिसनर फ़ंक्शन को जोड़ता है. |
इनहेरिट की गई:
addEventListener,
removeEventListener
| |
इवेंट | |
|---|---|
gmp-click |
function(event)आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब AdvancedMarkerElement एलिमेंट पर क्लिक किया जाता है. यह सिर्फ़ addEventListener() के साथ काम करता है, न कि addListener() के साथ. |
gmp-drag |
function(event)आर्ग्युमेंट:
जब उपयोगकर्ता AdvancedMarkerElement को खींचता है, तब यह इवेंट बार-बार ट्रिगर होता है. यह सिर्फ़ addEventListener() के साथ काम करता है, न कि addListener() के साथ. |
gmp-dragend |
function(event)आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब उपयोगकर्ता AdvancedMarkerElement को खींचना और छोड़ना बंद कर देता है. यह सिर्फ़ addEventListener() के साथ काम करता है, न कि addListener() के साथ. |
gmp-dragstart |
function(event)आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब उपयोगकर्ता AdvancedMarkerElement को खींचना और छोड़ना शुरू करता है. यह सिर्फ़ addEventListener() के साथ काम करता है, न कि addListener() के साथ. |
|
function(event)आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब AdvancedMarkerElement एलिमेंट पर क्लिक किया जाता है.addEventListener() के साथ उपलब्ध नहीं है. इसके बजाय, gmp-click का इस्तेमाल करें. |
|
function(event)आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब उपयोगकर्ता AdvancedMarkerElement को खींचना और छोड़ना शुरू करता है.addEventListener() के साथ उपलब्ध नहीं है. इसके बजाय, gmp-dragstart का इस्तेमाल करें. |
|
function(event)आर्ग्युमेंट:
जब उपयोगकर्ता AdvancedMarkerElement को खींचता है, तब यह इवेंट बार-बार ट्रिगर होता है.addEventListener() के साथ उपलब्ध नहीं है. इसके बजाय, gmp-drag का इस्तेमाल करें. |
|
function(event)आर्ग्युमेंट:
यह इवेंट तब ट्रिगर होता है, जब उपयोगकर्ता AdvancedMarkerElement को खींचना और छोड़ना बंद कर देता है.addEventListener() के साथ उपलब्ध नहीं है. इसके बजाय, gmp-dragend का इस्तेमाल करें. |
AdvancedMarkerElementOptions इंटरफ़ेस
इंटरफ़ेस
google.maps.marker.AdvancedMarkerElementOptions
AdvancedMarkerElement ने लागू किया
AdvancedMarkerElement बनाने के विकल्प.
प्रॉपर्टी | |
|---|---|
anchorLeft
ज़रूरी नहीं |
टाइप:
string optionalडिफ़ॉल्ट: "-50%"
सीएसएस लेंथ-परसेंटेज वैल्यू, जिसका इस्तेमाल मार्कर के ऐंकर पॉइंट को मार्कर के सबसे ऊपर बाएं कोने से ऑफ़सेट करने के लिए किया जाता है. यह तब काम आता है, जब किसी ऐसे विज़ुअल का इस्तेमाल किया जा रहा हो जिसका ऐंकर पॉइंट, डिफ़ॉल्ट मार्कर के सामान्य बॉटम सेंटर पॉइंट से अलग हो. |
anchorTop
ज़रूरी नहीं |
टाइप:
string optionalडिफ़ॉल्ट: "-100%"
सीएसएस लेंथ-परसेंटेज वैल्यू, जिसका इस्तेमाल मार्कर के ऐंकर पॉइंट को मार्कर के सबसे ऊपर बाएं कोने से ऑफ़सेट करने के लिए किया जाता है. यह तब काम आता है, जब किसी ऐसे विज़ुअल का इस्तेमाल किया जा रहा हो जिसका ऐंकर पॉइंट, डिफ़ॉल्ट मार्कर के सामान्य बॉटम सेंटर पॉइंट से अलग हो. |
collisionBehavior
ज़रूरी नहीं |
टाइप:
CollisionBehavior optionalएक सूची, जिसमें यह बताया गया है कि जब कोई AdvancedMarkerElement किसी दूसरे AdvancedMarkerElement या वेक्टर मैप पर बुनियादी मैप के लेबल से टकराता है, तो उसे कैसा व्यवहार करना चाहिए. ध्यान दें: |
content
ज़रूरी नहीं |
टाइप:
Node optionalडिफ़ॉल्ट:
PinElementAdvancedMarkerElement के विज़ुअल को सपोर्ट करने वाला डीओएम एलिमेंट. ध्यान दें: |
gmpClickable
ज़रूरी नहीं |
टाइप:
boolean optionalडिफ़ॉल्ट:
falsetrue होने पर, AdvancedMarkerElement पर क्लिक किया जा सकेगा और gmp-click इवेंट ट्रिगर होगा.साथ ही, ऐक्सेसिबिलिटी से जुड़े काम भी किए जा सकेंगे. उदाहरण के लिए, कीबोर्ड के ऐरो वाले बटन से यूआई ऐक्सेस किया जा सकेगा. |
gmpDraggable
ज़रूरी नहीं |
टाइप:
boolean optionalडिफ़ॉल्ट:
falsetrue होने पर, AdvancedMarkerElement को खींचकर छोड़ा जा सकता है. ध्यान दें: ऊंचाई के साथ |
map
ज़रूरी नहीं |
टाइप:
Map optionalवह मैप जिस पर AdvancedMarkerElement को दिखाना है. AdvancedMarkerElement दिखाने के लिए मैप ज़रूरी है. अगर मैप को कंस्ट्रक्शन के समय नहीं दिया गया है, तो इसे AdvancedMarkerElement.map सेट करके दिया जा सकता है. |
position
ज़रूरी नहीं |
टाइप:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalAdvancedMarkerElement की पोज़िशन सेट करता है. AdvancedMarkerElement को बिना किसी पोज़िशन के बनाया जा सकता है. हालांकि, इसे तब तक नहीं दिखाया जाएगा, जब तक इसकी पोज़िशन नहीं दी जाती. उदाहरण के लिए, उपयोगकर्ता की कार्रवाइयों या विकल्पों के हिसाब से. अगर कंस्ट्रक्शन के समय AdvancedMarkerElement की पोज़िशन नहीं दी गई है, तो AdvancedMarkerElement.position को सेट करके उसकी पोज़िशन दी जा सकती है. ध्यान दें: ऊंचाई के साथ |
title
ज़रूरी नहीं |
टाइप:
string optionalरोलओवर टेक्स्ट. अगर सुलभता टेक्स्ट दिया जाता है, तो उसे दी गई वैल्यू के साथ AdvancedMarkerElement में जोड़ दिया जाएगा. उदाहरण के लिए, स्क्रीन रीडर के साथ इस्तेमाल करने के लिए. |
zIndex
ज़रूरी नहीं |
टाइप:
number optionalसभी AdvancedMarkerElement को उनके zIndex के क्रम में मैप पर दिखाया जाता है. इसमें ज़्यादा वैल्यू वाले, कम वैल्यू वाले AdvancedMarkerElement के सामने दिखते हैं. डिफ़ॉल्ट रूप से, AdvancedMarkerElement स्क्रीन पर उनकी लंबाई में स्थिति के हिसाब से दिखते हैं. इसमें, स्क्रीन पर सबसे नीचे मौजूद AdvancedMarkerElement, स्क्रीन पर सबसे ऊपर मौजूद AdvancedMarkerElement के सामने दिखते हैं. साफ़ तौर पर बताए गए zIndex वाले मार्कर और बिना वाले मार्कर को मिलाने से, अनचाहे विज़ुअल नतीजे मिल सकते हैं. यह पक्का करने के लिए कि मार्कर उम्मीद के मुताबिक काम करें, हमारा सुझाव है कि आप सभी मार्कर के लिए zIndex सेट करें या इसे सेट न करें. ध्यान दें कि zIndex का इस्तेमाल, CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY ऐडवांस मार्कर के बीच प्राथमिकता तय करने के लिए भी किया जाता है. zIndex की ज़्यादा वैल्यू का मतलब है कि प्राथमिकता ज़्यादा है. |
AdvancedMarkerClickEvent क्लास
class
google.maps.marker.AdvancedMarkerClickEvent
extends Event
library "marker"
यह इवेंट, किसी ऐडवांस मार्कर पर क्लिक करने से ट्रिगर होता है. event.target.position की मदद से मार्कर की पोज़िशन ऐक्सेस करें.
const {AdvancedMarkerClickEvent} = await google.maps.importLibrary("marker");
PinElement क्लास
class
google.maps.marker.PinElement
extends HTMLElement
implements PinElementOptions
library "marker"
PinElement, एक डीओएम एलिमेंट को दिखाता है. इसमें एक शेप और एक ग्लिफ़ होता है. आकार में वही बैलून स्टाइल है जो डिफ़ॉल्ट AdvancedMarkerElement या Marker3DElement में दिखती है. ग्लिफ़, एक वैकल्पिक डीओएम एलिमेंट है. इसे गुब्बारे के आकार में दिखाया जाता है. PinElement का आसपेक्ट रेशियो (लंबाई-चौड़ाई का अनुपात), उसके PinElement.scale के हिसाब से अलग हो सकता है.
const {PinElement} = await google.maps.importLibrary("marker");
निर्माता | |
|---|---|
PinElement |
PinElement([options])पैरामीटर:
|
प्रॉपर्टी | |
|---|---|
background |
टाइप:
string optionalपिन के आकार का बैकग्राउंड कलर. PinElementOptions.background देखें. |
borderColor |
टाइप:
string optionalपिन के आकार के बॉर्डर का रंग. PinElementOptions.borderColor देखें. |
glyphColor |
टाइप:
string optionalपिन ग्लिफ़ का रंग. PinElementOptions.glyphColor देखें. |
glyphSrc |
टाइप:
URL|string optionalपिन में दिखाई जाने वाली ग्लिफ़ इमेज का सोर्स. PinElementOptions.glyphSrc देखें. |
glyphText |
टाइप:
string optionalपिन में दिखने वाला टेक्स्ट. PinElementOptions.glyphText देखें. |
scale |
टाइप:
number optionalPinElementOptions.scale देखें. |
readonly |
टाइप:
HTMLElementइस फ़ील्ड को सिर्फ़ पढ़ा जा सकता है. व्यू को सपोर्ट करने वाला डीओएम एलिमेंट. |
|
देखें. |
तरीके | |
|---|---|
इनहेरिट की गई:
addEventListener,
removeEventListener
|
PinElementOptions इंटरफ़ेस
इंटरफ़ेस
google.maps.marker.PinElementOptions
PinElement ने लागू किया
PinElement बनाने के विकल्प.
प्रॉपर्टी | |
|---|---|
background
ज़रूरी नहीं |
टाइप:
string optionalपिन के आकार का बैकग्राउंड कलर. इसमें सीएसएस की किसी भी कलर वैल्यू का इस्तेमाल किया जा सकता है. |
borderColor
ज़रूरी नहीं |
टाइप:
string optionalपिन के आकार के बॉर्डर का रंग. इसमें सीएसएस की किसी भी कलर वैल्यू का इस्तेमाल किया जा सकता है. |
ज़रूरी नहीं |
पिन में दिखाया गया DOM एलिमेंट. |
glyphColor
ज़रूरी नहीं |
टाइप:
string optionalग्लिफ़ का रंग. इसमें सीएसएस की किसी भी कलर वैल्यू का इस्तेमाल किया जा सकता है. |
glyphSrc
ज़रूरी नहीं |
टाइप:
URL|string optionalपिन में दिखाई जाने वाली ग्लिफ़ इमेज का सोर्स. |
glyphText
ज़रूरी नहीं |
टाइप:
string optionalपिन में दिखने वाला टेक्स्ट. |
scale
ज़रूरी नहीं |
टाइप:
number optionalडिफ़ॉल्ट:
1पिन का स्केल. |