जगह के आइकॉन से कई तरह की जगहों के बारे में पता चलता है, जैसे कि कॉफ़ी शॉप, लाइब्रेरी, और संग्रहालय. जगह की जानकारी या जगह की जानकारी का इस्तेमाल करके, आइकॉन और उनके बैकग्राउंड के रंगों का अनुरोध किया जा सकता है.
फ़ील्ड
जगह के आइकॉन के साथ काम करने के लिए इन फ़ील्ड का इस्तेमाल करें:
फ़ील्ड | क्लास की जगह | जगह से जुड़ी सेवा |
---|---|---|
आइकॉन | --- | icon |
आइकन पृष्ठभूमि का रंग | iconBackgroundColor |
icon_background_color |
आइकॉन मास्क यूआरआई | svgIconMaskURI |
icon_mask_base_uri |
icon
, 71 x 71 पिक्सल वाले रंगीन आइकॉन के लिए यूआरएल दिखाता है (सिर्फ़ जगह की जानकारी पर).- जगह आइकॉन की कैटगरी के लिए,
iconBackgroundColor
औरicon_background_color
डिफ़ॉल्ट रंग का HEX कलर कोड दिखाते हैं. icon_mask_base_uri
(जगह की जानकारी), बिना रंग वाले आइकॉन के लिए बेस यूआरएल दिखाता है. हालांकि, इससे फ़ाइल टाइप एक्सटेंशन (.svg
या.png
जोड़ें) को हटा दिया जाता है.svgIconMaskURI
(Place Class) बिना रंग वाले SVG आइकॉन के लिए बेस यूआरएल दिखाता है.
मार्कर पर जगह का आइकॉन और रंग लागू करना
जगह की जानकारी की मदद से, जगह के आइकॉन और बैकग्राउंड के रंग का अनुरोध किया जा सकता है. इन रंग को मार्कर पर लागू किया जा सकता है. नीचे दिया गया उदाहरण, जगह के डेटा का इस्तेमाल करके मार्कर बनाने के लिए कोड दिखाता है. इसके लिए, place.iconBackgroundColor
को PinElement.background
के विकल्प में और place.svgIconMaskURI
को PinElement.glyph
के पास भेजा जाता है. मार्कर को सही जगह पर लगाने के लिए place.location
का इस्तेमाल करें. इस उदाहरण में, मार्कर के टाइटल में place.displayName
भी दिखता है.
TypeScript
// A marker customized using a place icon and color, name, and geometry. const place = new Place({ id: 'ChIJN5Nz71W3j4ARhx5bwpTQEGg', }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: ['location', 'displayName', 'svgIconMaskURI', 'iconBackgroundColor'] }); const pinElement = new PinElement({ background: place.iconBackgroundColor, glyph: new URL(String(place.svgIconMaskURI)), }); const placeIconMarkerView = new AdvancedMarkerElement({ map, position: place.location, content: pinElement.element, title: place.displayName, });
JavaScript
// A marker customized using a place icon and color, name, and geometry. const place = new Place({ id: "ChIJN5Nz71W3j4ARhx5bwpTQEGg", }); // Call fetchFields, passing the desired data fields. await place.fetchFields({ fields: [ "location", "displayName", "svgIconMaskURI", "iconBackgroundColor", ], }); const pinElement = new PinElement({ background: place.iconBackgroundColor, glyph: new URL(String(place.svgIconMaskURI)), }); const placeIconMarkerView = new AdvancedMarkerElement({ map, position: place.location, content: pinElement.element, title: place.displayName, });
जगह का आइकॉन और बैकग्राउंड में रंग भरने के अनुरोध
नीचे दी गई टेबल में, कैटगरी के हिसाब से सभी उपलब्ध जगह के आइकॉन दिखाए गए हैं. डिफ़ॉल्ट रूप से, ये डिस्प्ले एक काले ग्लिफ़ के साथ नज़र आते हैं. आइकॉन के बैकग्राउंड का रंग, जगह की कैटगरी के हिसाब से तय होता है.
जगह की कैटगरी: खाना-पीना (आइकॉन बैकग्राउंड का रंग #FF9E67) |
|||
---|---|---|---|
बार, नाइट क्लब |
कैफ़े |
रेस्टोरेंट, बेकरी |
|
जगह की कैटगरी: रीटेल (आइकॉन बैकग्राउंड का रंग #4B96F3) |
|||
किताबें, कपड़े, इलेक्ट्रॉनिक्स, गहने, जूते, शॉपिंग सेंटर/मॉल |
किराने की दुकान |
किराने का सामान, सुपरमार्केट |
फ़ार्मेसी |
जगह की कैटगरी: सेवाएं (आइकॉन के बैकग्राउंड का रंग #909CE1) |
|||
एटीएम |
बैंक |
पेट्रोल पंप |
ठहरने की जगह |
पोस्ट ऑफ़िस |
|||
जगह की कैटगरी: मनोरंजन (आइकॉन के बैकग्राउंड का रंग #13B5C7) |
|||
अक्वेरियम, टूरिस्ट |
गॉल्फ़ |
ऐतिहासिक |
मूवी |
म्यूज़ियम |
थिएटर |
||
जगह की कैटगरी: परिवहन (आइकॉन बैकग्राउंड का रंग #10BDFF) |
|||
एयरपोर्ट |
बस, राइडशेयर, टैक्सी |
ट्रेन/रेल |
|
जगह की कैटगरी: नगरपालिका/सामान्य/धार्मिक (आइकॉन बैकग्राउंड का रंग #7B9EB0) |
|||
कब्रिस्तान |
नगरीय निर्माण |
लाइब्रेरी |
स्मारक |
पार्किंग |
स्कूल (प्राइमरी, सेकंडरी, यूनिवर्सिटी) |
पूजा (ईसाई) |
|
पूजा (हिंदू) |
पूजा (इस्लाम) |
पूजा (जैन) |
पूजा (यहूदी) |
पूजा (सिख) |
सामान्य कारोबार |
||
जगह की कैटगरी: आउटडोर (आइकॉन बैकग्राउंड का रंग #4DB546) |
|||
बोटिंग |
कैंपिंग |
पार्क |
स्टेडियम |
चिड़ियाघर |
|||
जगह की कैटगरी: आपातकाल (आइकॉन बैकग्राउंड का रंग #F88181) |
|||
अस्पताल |
पुलिस |