iOS के लिए Maps SDK टूल के लिए स्टाइल रेफ़रंस

स्टाइल के विकल्पों की मदद से, Google Maps की स्टैंडर्ड स्टाइल को पसंद के मुताबिक बनाया जा सकता है. साथ ही, सड़कों, पार्कों, कारोबारों, और दिलचस्पी की अन्य जगहों जैसी सुविधाओं के विज़ुअल डिसप्ले को बदला जा सकता है. इन सुविधाओं की स्टाइल बदलने के साथ-साथ, इन्हें पूरी तरह से छिपाया भी जा सकता है. इसका मतलब है कि मैप के किसी खास कॉम्पोनेंट को हाइलाइट किया जा सकता है या मैप को आस-पास के पेज की स्टाइल के हिसाब से बनाया जा सकता है.

उदाहरण

स्टाइल के लिए, यहां दिया गया JSON एलान, मैप की सभी सुविधाओं को स्लेटी रंग में बदल देता है. इसके बाद, मुख्य सड़क की ज्यामिति को नीले रंग में दिखाता है. साथ ही, लैंडस्केप के लेबल पूरी तरह से छिपा देता है:

[
  {
    "featureType": "all",
    "stylers": [
      { "color": "#C0C0C0" }
    ]
  },{
    "featureType": "road.arterial",
    "elementType": "geometry",
    "stylers": [
      { "color": "#CCFFFF" }
    ]
  },{
    "featureType": "landscape",
    "elementType": "labels",
    "stylers": [
      { "visibility": "off" }
    ]
  }
]

JSON ऑब्जेक्ट

स्टाइल के लिए, JSON एलान में ये एलिमेंट शामिल होते हैं:

• featureType (ज़रूरी नहीं) - स्टाइल में बदलाव के लिए चुनी जाने वाली सुविधाएं. सुविधाएं, मैप पर मौजूद भौगोलिक विशेषताएं होती हैं. इनमें सड़कें, पार्क, जलराशियां वगैरह शामिल हैं. अगर कोई सुविधा तय नहीं की जाती है, तो सभी सुविधाएं चुनी जाती हैं.
• elementType (ज़रूरी नहीं) - तय की गई सुविधा की वह प्रॉपर्टी जिसे चुनना है. एलिमेंट, किसी सुविधा के सब-पार्ट होते हैं. इनमें लेबल और ज्यामिति शामिल हैं. अगर कोई एलिमेंट तय नहीं किया जाता है, तो सुविधा के सभी एलिमेंट चुने जाते हैं.
• स्टाइलर - चुनी गई सुविधाओं और एलिमेंट पर लागू किए जाने वाले नियम. स्टाइलर, सुविधा का रंग, दिखने की सेटिंग, और वेट बताते हैं. किसी सुविधा पर एक या एक से ज़्यादा स्टाइलर लागू किए जा सकते हैं.

स्टाइल तय करने के लिए, आपको featureType और elementType सिलेक्टर के सेट और अपने stylers को स्टाइल ऐरे में शामिल करना होगा. एक ऐरे में, सुविधाओं के किसी भी कॉम्बिनेशन को टारगेट किया जा सकता है. हालांकि, एक साथ लागू की जा सकने वाली स्टाइल की संख्या सीमित होती है. अगर आपका स्टाइल ऐरे, वर्णों की तय की गई सीमा से ज़्यादा है, तो कोई स्टाइल लागू नहीं की जाती.

इस पेज के बाकी हिस्से में, सुविधाओं, एलिमेंट, और स्टाइलर के बारे में ज़्यादा जानकारी दी गई है.

featureType

JSON का यह स्निपेट, मैप पर मौजूद सभी सड़कों को चुनता है:

{
  "featureType": "road"
}

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

सुविधाएं, कैटगरी ट्री बनाती हैं. इसमें all रूट के तौर पर काम करता है. अगर कोई सुविधा तय नहीं की जाती है, तो सभी सुविधाएं चुनी जाती हैं. all की कोई सुविधा तय करने पर भी यही असर होता है.

कुछ सुविधाओं में चाइल्ड सुविधाएं शामिल होती हैं. इन्हें तय करने के लिए, डॉट नोटेशन का इस्तेमाल किया जाता है. उदाहरण के लिए, landscape.natural या road.local. अगर सिर्फ़ पैरंट सुविधा तय की जाती है, जैसे कि road, तो पैरंट के लिए तय की गई स्टाइल, उसकी सभी चाइल्ड सुविधाओं पर लागू होती हैं. जैसे, road.local और road.highway.

ध्यान दें कि पैरंट सुविधाओं में कुछ ऐसे एलिमेंट शामिल हो सकते हैं जो उनकी सभी चाइल्ड सुविधाओं में शामिल नहीं होते.

ये सुविधाएं उपलब्ध हैं:

• all (डिफ़ॉल्ट) से सभी सुविधाएं चुनी जाती हैं.
• administrative से सभी प्रशासनिक इलाके चुने जाते हैं. स्टाइलिंग का असर सिर्फ़ प्रशासनिक इलाकों के लेबल पर पड़ता है. भौगोलिक सीमाओं या फ़िल पर नहीं.
  • administrative.country से देश चुने जाते हैं.
  • administrative.land_parcel से ज़मीन के पार्सल चुने जाते हैं.
  • administrative.locality से इलाके चुने जाते हैं.
  • administrative.neighborhood से आस-पास के इलाके चुने जाते हैं.
  • administrative.province से प्रांत चुने जाते हैं.
• landscape से सभी लैंडस्केप चुने जाते हैं.
  • landscape.man_made से, मैन-मेड सुविधाएं चुनी जाती हैं. जैसे, इमारतें और अन्य स्ट्रक्चर.
  • landscape.natural से, प्राकृतिक सुविधाएं चुनी जाती हैं. जैसे, पहाड़, नदियां, रेगिस्तान, और ग्लेशियर.
  • landscape.natural.landcover से, लैंड कवर की सुविधाएं चुनी जाती हैं. ये वे फ़िज़िकल चीज़ें होती हैं जो पृथ्वी की सतह को कवर करती हैं. जैसे, जंगल, घास के मैदान, दलदल, और बंजर ज़मीन.
  • landscape.natural.terrain से, ज़मीन की सतह की टरेन सुविधाएं चुनी जाती हैं, जैसे, ऊंचाई, ढलान, और ओरिएंटेशन.
• poi से, दिलचस्पी की सभी जगहें चुनी जाती हैं.
  • poi.attraction से, पर्यटकों के घूमने की जगहें चुनी जाती हैं.
  • poi.business से, कारोबार चुने जाते हैं.
  • poi.government से, सरकारी इमारतें चुनी जाती हैं.
  • poi.medical से, आपातकालीन सेवाएं चुनी जाती हैं. इनमें अस्पताल, फ़ार्मेसी, पुलिस, डॉक्टर वगैरह शामिल हैं.
  • poi.park से, पार्क चुने जाते हैं.
  • poi.place_of_worship से, पूजा की जगहें चुनी जाती हैं. इनमें चर्च, मंदिर, मस्जिद वगैरह शामिल हैं.
  • poi.school से, स्कूल चुने जाते हैं.
  • poi.sports_complex से, खेल परिसर चुने जाते हैं.
• road से, सभी सड़कें चुनी जाती हैं.
  • road.arterial से, मुख्य सड़कें चुनी जाती हैं.
  • road.highway से, हाइवे चुने जाते हैं.
  • road.highway.controlled_access से, नियंत्रित ऐक्सेस वाले हाइवे चुने जाते हैं.
  • road.local से, स्थानीय सड़कें चुनी जाती हैं.
• transit से, ट्रांज़िट के सभी स्टेशन और लाइनें चुनी जाती हैं.
  • transit.line से, ट्रांज़िट लाइनें चुनी जाती हैं.
  • transit.station से, ट्रांज़िट के सभी स्टेशन चुने जाते हैं.
  • transit.station.airport से, हवाई अड्डे चुने जाते हैं.
  • transit.station.bus से, बस स्टॉप चुने जाते हैं.
  • transit.station.rail से, रेल स्टेशन चुने जाते हैं.
• water से, जलराशियां चुनी जाती हैं.

elementType

JSON का यह स्निपेट, सभी स्थानीय सड़कों के लेबल चुनता है:

{
  "featureType": "road.local",
  "elementType": "labels"
}

एलिमेंट, किसी सुविधा के सबडिविज़न होते हैं. उदाहरण के लिए, सड़क में मैप पर दिखने वाली ग्राफ़िकल लाइन (ज्यामिति) और उसका नाम बताने वाला टेक्स्ट (लेबल) शामिल होता है.

ये एलिमेंट उपलब्ध हैं. हालांकि, ध्यान दें कि किसी खास सुविधा में इनमें से कोई भी, कुछ या सभी एलिमेंट शामिल हो सकते हैं:

ज़ूम करने के लेवल के हिसाब से, लेबल टेक्स्ट के fill और stroke के रंग बदलते हैं. ज़ूम लेवल के हिसाब से एक जैसा अनुभव देने के लिए, हमेशा fill और stroke दोनों को तय करें.

• all (डिफ़ॉल्ट) से, तय की गई सुविधा के सभी एलिमेंट चुने जाते हैं.
• geometry से, तय की गई सुविधा के सभी ज्यामितीय एलिमेंट चुने जाते हैं.
  • geometry.fill से, सुविधा की ज्यामिति का सिर्फ़ फ़िल चुना जाता है.
  • geometry.stroke से, सुविधा की ज्यामिति का सिर्फ़ स्ट्रोक चुना जाता है.
• labels से, तय की गई सुविधा से जुड़े टेक्स्ट वाले लेबल चुने जाते हैं.
  • labels.icon से, सुविधा के लेबल में दिखने वाला सिर्फ़ आइकॉन चुना जाता है.
  • labels.text से, लेबल का सिर्फ़ टेक्स्ट चुना जाता है.
  • labels.text.fill से, लेबल का सिर्फ़ फ़िल चुना जाता है. आम तौर पर, लेबल का फ़िल, लेबल टेक्स्ट के चारों ओर रंगीन आउटलाइन के तौर पर रेंडर किया जाता है.
  • labels.text.stroke से, लेबल के टेक्स्ट का सिर्फ़ स्ट्रोक चुना जाता है.

stylers

स्टाइलर, फ़ॉर्मैटिंग के वे विकल्प होते हैं जिन्हें मैप की सुविधाओं और एलिमेंट पर लागू किया जा सकता है.

JSON का यह स्निपेट, आरजीबी वैल्यू का इस्तेमाल करके किसी सुविधा को चमकीले हरे रंग में दिखाता है:

"stylers": [
  { "color": "#99FF33" }
]

यह स्निपेट, किसी सुविधा के रंग से पूरी इंटेंसिटी हटा देता है. भले ही, उसका शुरुआती रंग कुछ भी हो. इसका असर यह होता है कि सुविधा को ग्रेस्केल में रेंडर किया जाता है:

"stylers": [
  { "saturation": -100 }
]

यह स्निपेट, किसी सुविधा को पूरी तरह से छिपा देता है:

    "stylers": [
      { "visibility": "off" }
    ]

स्टाइल के ये विकल्प काम करते हैं:

• hue (आरजीबी हेक्स स्ट्रिंग, जिसका फ़ॉर्मैट #RRGGBB) बुनियादी रंग दिखाता है.

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

• lightness (-100 और 100 के बीच फ़्लोटिंग पॉइंट वैल्यू) एलिमेंट की चमक में होने वाले प्रतिशत बदलाव को दिखाती है. नेगेटिव वैल्यू से अंधेरा बढ़ता है (जहां -100 का मतलब काला रंग है) वहीं पॉज़िटिव वैल्यू से चमक बढ़ती है (जहां +100 का मतलब सफ़ेद रंग है).

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

• saturation (फ़्लोटिंग पॉइंट वैल्यू, जो -100 और 100 के बीच होती है) एलिमेंट पर लागू किए जाने वाले बुनियादी रंग की इंटेंसिटी में होने वाले प्रतिशत बदलाव को दिखाती है.

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

• gamma (फ़्लोटिंग पॉइंट वैल्यू, जो 0.01 और 10.0 के बीच होती है. इसमें 1.0 का मतलब है कि कोई सुधार लागू नहीं किया गया है) एलिमेंट पर लागू किए जाने वाले गामा सुधार की मात्रा को दिखाती है. गामा सुधार रंगों की लाइटनेस को नॉन-लीनियर तरीके से बदलते हैं. हालांकि, इससे सफ़ेद या काले रंग की वैल्यू पर कोई असर नहीं पड़ता. आम तौर पर, गामा सुधार का इस्तेमाल कई एलिमेंट के कंट्रास्ट को बदलने के लिए किया जाता है. उदाहरण के लिए, एलिमेंट के किनारों और अंदरूनी हिस्सों के बीच कंट्रास्ट को बढ़ाने या घटाने के लिए, गामा में बदलाव किया जा सकता है.

  ध्यान दें: इस विकल्प से, गामा कर्व का इस्तेमाल करके डिफ़ॉल्ट Google स्टाइल के हिसाब से लाइटनेस को अडजस्ट किया जाता है. अगर Google, बुनियादी मैप की स्टाइल में कोई बदलाव करता है, तो उन बदलावों का असर आपके मैप की उन सुविधाओं पर पड़ता है जिनकी स्टाइलिंग gamma का इस्तेमाल करके की गई है. अगर हो सके, तो color स्टाइलर का इस्तेमाल करना बेहतर है.

• invert_lightness (अगर true) मौजूदा लाइटनेस को इनवर्ट कर देता है. उदाहरण के लिए, सफ़ेद टेक्स्ट वाले गहरे रंग के मैप पर तुरंत स्विच करने के लिए यह विकल्प काम का है.

  ध्यान दें: इस विकल्प से, डिफ़ॉल्ट Google स्टाइल को इनवर्ट किया जाता है. अगर Google बुनियादी मैप की स्टाइल में कोई बदलाव करता है, तो उन बदलावों का असर आपके मैप की उन सुविधाओं पर पड़ता है जिनकी स्टाइलिंग invert_lightness का इस्तेमाल करके की गई है. अगर हो सके, तो color स्टाइलर का इस्तेमाल करना बेहतर है.

• visibility (on, off, या simplified) से पता चलता है कि एलिमेंट, मैप पर दिखता है या नहीं और कैसे दिखता है. A simplified विज़िबिलिटी से, प्रभावित सुविधाओं से स्टाइल की कुछ सुविधाएं हट जाती हैं. उदाहरण के लिए, सड़कों को बिना आउटलाइन वाली पतली लाइनों में बदल दिया जाता है. वहीं, पार्कों के लेबल टेक्स्ट हट जाते हैं, लेकिन लेबल आइकॉन बरकरार रहते हैं.
• color (आरजीबी हेक्स स्ट्रिंग, जिसका फ़ॉर्मैट #RRGGBB) से, सुविधा का रंग सेट किया जाता है.
• weight (इंटीजर वैल्यू, जो शून्य से ज़्यादा या उसके बराबर होती है) से सुविधा का वेट पिक्सल में सेट किया जाता है. वेट को ज़्यादा वैल्यू पर सेट करने से, टाइल के बॉर्डर के पास क्लिप करने की समस्या हो सकती है.

स्टाइल के नियम, तय किए गए क्रम में लागू होते हैं. एक ही स्टाइल ऑपरेशन में, कई कार्रवाइयों को एक साथ न करें. इसके बजाय, हर कार्रवाई को स्टाइल ऐरे में अलग-अलग एंट्री के तौर पर तय करें.

ध्यान दें: क्रम ज़रूरी है, क्योंकि कुछ कार्रवाइयां कम्यूटेटिव नहीं होती हैं. स्टाइल ऑपरेशन के ज़रिए बदली गई सुविधाओं और/या एलिमेंट में (आम तौर पर) पहले से ही स्टाइल मौजूद होती हैं. अगर ये स्टाइल मौजूद हैं, तो ऑपरेशन उन पर लागू होते हैं.

ह्यू, सैचुरेशन, लाइटनेस मॉडल

स्टाइल किए गए मैप, स्टाइलर ऑपरेशन में रंग दिखाने के लिए, ह्यू, सैचुरेशन, लाइटनेस (एचएसएल) मॉडल का इस्तेमाल करते हैं. ह्यू बुनियादी रंग दिखाता है, रंग का गहरा या फीका होना उस रंग की इंटेंसिटी दिखाता है, और लाइटनेस रंग में सफ़ेद या काले रंग की मात्रा दिखाता है.

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

hue एचटीएमएल हेक्स कलर वैल्यू लेता है. हालांकि, यह इस वैल्यू का इस्तेमाल सिर्फ़ बुनियादी रंग तय करने के लिए करता है. यानी, कलर व्हील के चारों ओर इसका ओरिएंटेशन. यह सैचुरेशन या लाइटनेस के लिए इस वैल्यू का इस्तेमाल नहीं करता. सैचुरेशन या लाइटनेस को प्रतिशत बदलाव के तौर पर अलग से दिखाया जाता है.

उदाहरण के लिए, शुद्ध हरे रंग के लिए ह्यू को hue:0x00ff00 या hue:0x000100 के तौर पर तय किया जा सकता है. दोनों ह्यू एक जैसे हैं. दोनों वैल्यू, एचएसएल कलर मॉडल में शुद्ध हरे रंग की ओर इशारा करती हैं.

आरजीबी कलर व्हील

आरजीबी hue वैल्यू में लाल, हरे, और नीले रंग के बराबर हिस्से शामिल होते हैं . ये वैल्यू, ह्यू नहीं दिखाती हैं, क्योंकि इनमें से कोई भी वैल्यू, एचएसएल कोऑर्डिनेट स्पेस में ओरिएंटेशन नहीं दिखाती . उदाहरण के लिए, "#000000" (काला), "#FFFFFF" (सफ़ेद), और स्लेटी रंग के सभी शुद्ध शेड. काला, सफ़ेद या स्लेटी रंग दिखाने के लिए, आपको सभी saturation हटाने होंगे (वैल्यू को -100 पर सेट करें) और lightness को अडजस्ट करना होगा.

इसके अलावा, मौजूदा सुविधाओं में बदलाव करते समय, जिनमें पहले से ही कलर स्कीम मौजूद है, hue जैसी वैल्यू बदलने पर, मौजूदा saturation या lightness में कोई बदलाव नहीं होता.