Maps स्टैटिक एपीआई के लिए स्टाइल रेफ़रंस

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

उदाहरण

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"
}

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

नीचे दिए गए एलिमेंट उपलब्ध हैं, लेकिन हो सकता है कि एक खास सुविधा किसी भी एलिमेंट या कुछ या सभी एलिमेंट के साथ काम न करे:

  • 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 से स्टाइल किया गया है. अगर हो सके, तो बेहतर होगा कि आप absolute 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) से पता चलता है कि एलिमेंट, मैप पर दिखता है या नहीं और अगर दिखता है, तो कैसे दिखता है. simplified विज़िबिलिटी से, जिन फ़ीचर पर असर पड़ा है उनसे कुछ स्टाइल फ़ीचर हट जाते हैं. उदाहरण के लिए, सड़कों को बिना आउटलाइन वाली पतली लाइनों में बदल दिया जाता है. वहीं, पार्क के लेबल का टेक्स्ट हट जाता है, लेकिन लेबल आइकॉन बना रहता है.
  • color (#RRGGBB फ़ॉर्मैट की आरजीबी हेक्स स्ट्रिंग), सुविधा का रंग सेट करता है.
  • weight (पूर्णांक वैल्यू, जो शून्य से ज़्यादा या उसके बराबर हो) से, पिक्सल में फ़ीचर का वज़न सेट होता है. वज़न को ज़्यादा वैल्यू पर सेट करने से, टाइल के बॉर्डर के आस-पास का हिस्सा कट सकता है.

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

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

रंग, गहरा या फीका करने वाला मॉडल

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

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

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

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

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

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

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

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