स्टाइल के विकल्पों की मदद से, 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 (ज़रूरी नहीं) - चुनने के लिए तय की गई सुविधा की प्रॉपर्टी. एलिमेंट, किसी सुविधा के उप-भाग होते हैं. इनमें लेबल और ज्यामिति शामिल होती है. अगर किसी एलिमेंट का इस्तेमाल नहीं किया जाता है, तो सुविधा के सभी एलिमेंट चुन लिए जाते हैं.
- stylers - चुनी गई सुविधाओं और एलिमेंट पर लागू किए जाने वाले नियम. स्टाइलर, सुविधा के रंग, दिखने, और वज़न के बारे में बताते हैं. किसी सुविधा में एक या उससे ज़्यादा स्टाइलर लागू किए जा सकते हैं.
किसी स्टाइल के बारे में बताने के लिए, आपको 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वाली स्टाइल में होती हैं. अगर हो सके, तो असल में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 में कोई बदलाव नहीं होता.