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