क्लाउड पर मैप की स्टाइलिंग के लिए JSON स्कीमा का इस्तेमाल करके, मैप को अपनी पसंद के मुताबिक बनाया जा सकता है. ठीक वैसे ही जैसे स्टाइल एडिटर इंटरफ़ेस का इस्तेमाल करके किया जाता है. इस दस्तावेज़ में, JSON स्कीमा और JSON स्टाइल के एलान करने के तरीके के बारे में बताया गया है.
स्टाइल एडिटर में JSON का इस्तेमाल करके, मैप की स्टाइल में बदलाव करने का तरीका जानने के लिए, क्लाउड पर मैप की स्टाइलिंग की सुविधा के साथ JSON का इस्तेमाल करना लेख पढ़ें. इसके अलावा, मैप की स्टाइल इंपोर्ट और एक्सपोर्ट करने का तरीका भी जानें.
स्टाइल के JSON एलान का उदाहरण देखें
नीचे दिए गए JSON स्टाइल के एलान में, बैकग्राउंड का रंग सेट किया गया है. इसके बाद, इसमें दिलचस्पी की जगहों, पार्क, पानी की सुविधाओं के लिए स्टाइल तय की गई हैं. साथ ही, इसमें खाने-पीने की जगहों के लेबल छिपाए गए हैं.
{
  "variant": "light",
  "styles": [
    {
      "id": "natural.land",
      "geometry": {
        "fillColor": "#f7e3f7"
      }
    },
    {
      "id": "natural.water",
      "geometry": {
        "fillColor": "#d4b2ff"
      },
      "label": {
        "textFillColor": "#3d2163",
        "textStrokeColor": "#f0e1ff"
      }
    },
    {
      "id": "pointOfInterest",
      "label": {
        "pinFillColor": "#e0349a",
        "textFillColor": "#a11e6e",
        "textStrokeColor": "#ffd9f0"
      }
    },
    {
      "id": "pointOfInterest.emergency.hospital",
      "geometry": {
        "fillColor": "#ffe3e3"
      }
    },
    {
      "id": "pointOfInterest.foodAndDrink",
      "label": {
        "visible": false
      }
    },
    {
      "id": "pointOfInterest.recreation.park",
      "geometry": {
        "fillColor": "#f9b9d2"
      }
    }
  ]
}
JSON ऑब्जेक्ट
JSON स्टाइल के एलान में, टॉप-लेवल का ऑब्जेक्ट और स्टाइल के नियमों का एक कलेक्शन होता है.
- टॉप-लेवल सेटिंग (ज़रूरी नहीं) - ग्लोबल स्टाइल सेटिंग, जैसे कि
backgroundColorऔरvariant.
- styles- यह स्टाइल के नियमों वाले ऑब्जेक्ट का कलेक्शन होता है. इसमें ये शामिल हो सकते हैं:- id- इस स्टाइल में बदलाव करने के लिए, मैप की सुविधा चुनें (जैसे,- pointOfInterest.recreation.park).
- geometry(ज़रूरी नहीं) - मैप फ़ीचर के ज्यामितीय एलिमेंट और स्टाइल के नियम लागू करने के लिए (जैसे,- fillColor).
- label(ज़रूरी नहीं) - मैप की सुविधा का टेक्स्ट या पिन लेबल और स्टाइल के नियम लागू करने के लिए (जैसे,- textStrokeColor).
 
टॉप-लेवल की सेटिंग
नीचे दी गई टेबल में मौजूद प्रॉपर्टी, मैप स्टाइल पर लागू होती हैं.
| प्रॉपर्टी | टाइप | ब्यौरा | उदाहरण | 
|---|---|---|---|
| 
 | स्ट्रिंग | #RRGGBB हेक्स स्ट्रिंग का इस्तेमाल करके, मैप ऐप्लिकेशन के बैकग्राउंड के रंग को पसंद के मुताबिक बनाएं. इस सेटिंग में, पारदर्शिता में बदलाव करने की सुविधा काम नहीं करती. | "#002211" | 
| 
 | "light"|"dark" | हल्के या गहरे रंग वाला मोड चुनें. अगर कोई वैल्यू नहीं दी जाती है, तो डिफ़ॉल्ट रूप से "light" वैल्यू सेट होती है. | "लाइट" | 
| 
 | बूलियन | मोनोक्रोम मोड चालू करने के लिए, मैप के ग्रे वर्शन के लिए trueका इस्तेमाल करें. | 
 | 
स्टाइल के नियम वाले ऑब्जेक्ट
इस सेक्शन में उन प्रॉपर्टी के बारे में बताया गया है जो मैप की सुविधाओं को पसंद के मुताबिक बनाने के लिए, styles ऐरे में स्टाइल के नियम वाले ऑब्जेक्ट तय करती हैं. हर स्टाइल के नियम वाले ऑब्जेक्ट में ये चीज़ें होनी चाहिए:
- idप्रॉपर्टी.
- geometryया- labelएलिमेंट, जिसमें स्टाइलर से जुड़ी प्रॉपर्टी तय की गई हों.
id (मैप की सुविधा)
id प्रॉपर्टी, स्टाइल करने के लिए मैप की सुविधा के बारे में बताती है. प्रॉपर्टी के नाम, स्टाइल एडिटर में मैप की सुविधा के नामों के कैमलकेस वर्शन होते हैं.
मैप की सुविधाओं से कैटगरी ट्री बनता है. अगर आपने पैरंट फ़ीचर टाइप, जैसे कि pointOfInterest तय किया है, तो पैरंट के लिए तय की गई स्टाइल, उसके सभी चाइल्ड पर लागू होंगी. जैसे, pointOfInterest.retail और pointOfInterest.lodging.
ज़्यादा जानकारी के लिए, क्रम से मैप की सुविधाएं देखें.
उपलब्ध id प्रॉपर्टी की सूची
id की ये प्रॉपर्टी उपलब्ध हैं:
- pointOfInterest
- pointOfInterest.emergency
- pointOfInterest.emergency.fire
- pointOfInterest.emergency.hospital
- pointOfInterest.emergency.pharmacy
- pointOfInterest.emergency.police
- pointOfInterest.entertainment
- pointOfInterest.entertainment.arts
- pointOfInterest.entertainment.casino
- pointOfInterest.entertainment.cinema
- pointOfInterest.entertainment.historic
- pointOfInterest.entertainment.museum
- pointOfInterest.entertainment.themePark
- pointOfInterest.entertainment.touristAttraction
- pointOfInterest.foodAndDrink
- pointOfInterest.foodAndDrink.bar
- pointOfInterest.foodAndDrink.cafe
- pointOfInterest.foodAndDrink.restaurant
- pointOfInterest.foodAndDrink.winery
- pointOfInterest.landmark
- pointOfInterest.lodging
- pointOfInterest.recreation
- pointOfInterest.recreation.beach
- pointOfInterest.recreation.boating
- pointOfInterest.recreation.fishing
- pointOfInterest.recreation.golfCourse
- pointOfInterest.recreation.hotSpring
- pointOfInterest.recreation.natureReserve
- pointOfInterest.recreation.park
- pointOfInterest.recreation.peak
- pointOfInterest.recreation.sportsComplex
- pointOfInterest.recreation.sportsField
- pointOfInterest.recreation.trailhead
- pointOfInterest.recreation.zoo
- pointOfInterest.retail
- pointOfInterest.retail.grocery
- pointOfInterest.retail.shopping
- pointOfInterest.service
- pointOfInterest.service.atm
- pointOfInterest.service.bank
- pointOfInterest.service.carRental
- pointOfInterest.service.evCharging
- pointOfInterest.service.gasStation
- pointOfInterest.service.parkingLot
- pointOfInterest.service.postOffice
- pointOfInterest.service.restStop
- pointOfInterest.service.restroom
- pointOfInterest.transit
- pointOfInterest.transit.airport
- pointOfInterest.other
- pointOfInterest.other.bridge
- pointOfInterest.other.cemetery
- pointOfInterest.other.government
- pointOfInterest.other.library
- pointOfInterest.other.military
- pointOfInterest.other.placeOfWorship
- pointOfInterest.other.school
- pointOfInterest.other.townSquare
- political
- political.countryOrRegion
- political.border
- political.reservation
- political.stateOrProvince
- political.city
- political.sublocality
- political.neighborhood
- political.landParcel
- infrastructure
- infrastructure.building
- infrastructure.building.commercial
- infrastructure.businessCorridor
- infrastructure.roadNetwork
- infrastructure.roadNetwork.noTraffic
- infrastructure.roadNetwork.noTraffic.pedestrianMall
- infrastructure.roadNetwork.noTraffic.trail
- infrastructure.roadNetwork.noTraffic.trail.paved
- infrastructure.roadNetwork.noTraffic.trail.unpaved
- infrastructure.roadNetwork.parkingAisle
- infrastructure.roadNetwork.ramp
- infrastructure.roadNetwork.road
- infrastructure.roadNetwork.road.arterial
- infrastructure.roadNetwork.road.highway
- infrastructure.roadNetwork.road.local
- infrastructure.roadNetwork.road.noOutlet
- infrastructure.roadNetwork.roadShield
- infrastructure.roadNetwork.roadSign
- infrastructure.roadNetwork.roadDetail
- infrastructure.roadNetwork.roadDetail.surface
- infrastructure.roadNetwork.roadDetail.crosswalk
- infrastructure.roadNetwork.roadDetail.sidewalk
- infrastructure.roadNetwork.roadDetail.intersection
- infrastructure.railwayTrack
- infrastructure.railwayTrack.commercial
- infrastructure.railwayTrack.commuter
- infrastructure.transitStation
- infrastructure.transitStation.bicycleShare
- infrastructure.transitStation.busStation
- infrastructure.transitStation.ferryTerminal
- infrastructure.transitStation.funicularStation
- infrastructure.transitStation.gondolaStation
- infrastructure.transitStation.monorail
- infrastructure.transitStation.railStation
- infrastructure.transitStation.railStation.subwayStation
- infrastructure.transitStation.railStation.tramStation
- infrastructure.urbanArea
- natural
- natural.continent
- natural.archipelago
- natural.island
- natural.land
- natural.land.landCover
- natural.land.landCover.crops
- natural.land.landCover.dryCrops
- natural.land.landCover.forest
- natural.land.landCover.ice
- natural.land.landCover.sand
- natural.land.landCover.shrub
- natural.land.landCover.tundra
- natural.water
- natural.water.ocean
- natural.water.lake
- natural.water.river
- natural.water.other
- natural.base
एलिमेंट
एलिमेंट, मैप फ़ीचर के सबडिविज़न होते हैं. उदाहरण के लिए, मैप पर सड़क को ग्राफ़िकल लाइन (geometry) के तौर पर दिखाया जाता है. साथ ही, सड़क का नाम (label) टेक्स्ट के तौर पर दिखाया जाता है.
ये एलिमेंट उपलब्ध हैं. हालांकि, ध्यान दें कि मैप की कोई सुविधा, इनमें से किसी भी एलिमेंट के साथ काम नहीं कर सकती. इसके अलावा, यह भी हो सकता है कि वह कुछ या सभी एलिमेंट के साथ काम करे:
- geometry: यह मैप की चुनी गई सुविधा के सभी ज्यामितीय एलिमेंट (जैसे, पॉलीगॉन, पॉलीलाइन) चुनता है.
- label: यह मैप की चुनी गई सुविधा के सभी लेबल एलिमेंट (जैसे, टेक्स्ट, पिन) चुनता है.
स्टाइलर
स्टाइलर की मदद से, मैप की हर सुविधा के एलिमेंट के लिए स्टाइल के नियम तय किए जाते हैं.
उदाहरण के लिए, किसी बिल्डिंग के फ़ुटप्रिंट के लिए, हर एलिमेंट को इस तरह स्टाइल किया जा सकता है:
| किसी इमारत के लिए geometryस्टाइलर का उदाहरण | किसी इमारत के लिए labelस्टाइलर का उदाहरण | 
|---|---|
| मैप पर बिल्डिंग के फ़ुटप्रिंट पॉलीगॉन को छिपाना है या दिखाना है. | बिल्डिंग के लेबल को छिपाना है या दिखाना है. | 
| पॉलीगॉन के अंदर के रंग और अपारदर्शिता. | टेक्स्ट के अंदर के रंग और अपारदर्शिता. | 
| बॉर्डर का रंग, ओपैसिटी, और चौड़ाई. | टेक्स्ट के स्ट्रोक का रंग और ओपैसिटी. | 
इस सेक्शन में, geometry और label एलिमेंट के लिए उपलब्ध अलग-अलग स्टाइल के विकल्पों के बारे में बताया गया है.
geometry स्टाइलर
यहां दी गई टेबल में, सभी उपलब्ध ज्योमेट्रिक स्टाइलर की सूची दी गई है.
| स्टाइलर | टाइप | ब्यौरा | 
|---|---|---|
| 
 | बूलियन | मैप की किसी सुविधा के पॉलीगॉन या पॉलीलाइन को छिपाने के लिए, इसे falseपर सेट करें. | 
| 
 | स्ट्रिंग | आरजीबी हेक्स स्ट्रिंग का इस्तेमाल करके, पॉलीगॉन या पॉलीलाइन के रंग को पसंद के मुताबिक बनाएं. | 
| 
 | फ़्लोट | पॉलीगॉन या पॉलीलाइन की ओपैसिटी को पसंद के मुताबिक बनाएं. इसमें 0 का मतलब पारदर्शी और 1 का मतलब अपारदर्शी होता है. | 
| 
 | स्ट्रिंग | आरजीबी हेक्स स्ट्रिंग की मदद से, आउटलाइन के रंग को पसंद के मुताबिक बनाएं. | 
| 
 | फ़्लोट | आउटलाइन की ओपैसिटी को पसंद के मुताबिक बनाएं. इसमें 0 का मतलब पारदर्शी और 1 का मतलब अपारदर्शी होता है. | 
| 
 | फ़्लोट | आउटलाइन की मोटाई को 0 से 8 तक की रेंज में अपनी पसंद के मुताबिक बनाएं. | 
ज़्यादा जानकारी के लिए, पॉलीगॉन और पॉलीलाइन देखें.
label स्टाइलर
यहां दी गई टेबल में, सभी उपलब्ध लेबल स्टाइलर की सूची दी गई है.
| स्टाइलर | टाइप | ब्यौरा | 
|---|---|---|
| 
 | बूलियन | मैप की किसी सुविधा के लेबल को छिपाने के लिए, falseपर सेट करें. | 
| 
 | स्ट्रिंग | आरजीबी हेक्स स्ट्रिंग का इस्तेमाल करके, टेक्स्ट लेबल के रंग को पसंद के मुताबिक बनाएं. | 
| 
 | फ़्लोट | टेक्स्ट लेबल की ओपैसिटी को पसंद के मुताबिक बनाएं. इसमें 0 का मतलब पारदर्शी और 1 का मतलब अपारदर्शी होता है. | 
| 
 | स्ट्रिंग | आरजीबी हेक्स स्ट्रिंग की मदद से, आउटलाइन के रंग को पसंद के मुताबिक बनाएं. | 
| 
 | फ़्लोट | आउटलाइन की ओपैसिटी को पसंद के मुताबिक बनाएं. इसमें 0 का मतलब पारदर्शी और 1 का मतलब अपारदर्शी होता है. | 
| 
 | फ़्लोट | आउटलाइन की मोटाई को 0 से 8 तक की रेंज में अपनी पसंद के मुताबिक बनाएं. | 
| 
 | स्ट्रिंग | आरजीबी हेक्स स्ट्रिंग की मदद से, पिन के रंग को पसंद के मुताबिक बनाएं. | 
ज़्यादा जानकारी के लिए, आइकॉन और टेक्स्ट लेबल देखें.
कीज़ूम
सभी कीज़ूम लेवल के लिए, किसी सुविधा के लिए एक ही स्टाइल सेट की जा सकती है. इसके अलावा, अलग-अलग कीज़ूम लेवल के लिए अलग-अलग स्टाइल भी तय की जा सकती हैं. सिर्फ़ एक स्टाइल देने पर, इसका इस्तेमाल z0 से शुरू होने वाले सभी कीज़ूम लेवल के लिए किया जाएगा. अगर आपने अलग-अलग कीज़ूम लेवल के लिए स्टाइल दी हैं, तो स्टाइल उस ज़ूम लेवल से लेकर आपके तय किए गए अगले ज़ूम लेवल तक लागू होगी.
किसी स्टाइल के लिए कीज़ूम लेवल सेट करने के लिए, स्टाइलर प्रॉपर्टी में z0 से z22 तक कीज़ूम लेवल तय करें. इसके बाद, स्टाइलर को पसंद के मुताबिक बनाएं.
यहां दिए गए उदाहरण में, कीज़ूम लेवल 0 से 5 तक पानी का रंग काला है. कीज़ूम लेवल 6 से 11 तक पानी का रंग गहरा सलेटी है. वहीं, कीज़ूम लेवल 12 से पानी का रंग हल्का सलेटी है.
{
  "id": "natural.water",
  "geometry": {
    "fillColor": {
      "z0": "#000000",
      "z6": "#666666",
      "z12": "#cccccc"
    }
  }
}
ज़्यादा जानकारी के लिए, स्टाइल के ज़ूम लेवल देखें.
सीमाएं
Google Cloud Console में, JSON का इस्तेमाल करके लगभग हर चीज़ को स्टाइल किया जा सकता है. हालांकि, मैप की सेटिंग मेन्यू में मौजूद इन सुविधाओं को स्टाइल नहीं किया जा सकता:
इन सुविधाओं के लिए, आपको मैप सेटिंग मेन्यू में जाकर अपनी पसंद चुननी होगी.