Ta strona została przetłumaczona przez Cloud Translation API.

Dokumentacja JSON definiowania stylów map w Google Cloud

Wybierz platformę: Android iOS JavaScript Usługa internetowa

Schemat JSON stylów map w Google Cloud umożliwia dostosowywanie map za pomocą JSON, tak jak w interfejsie edytora stylów. Ten dokument opisuje schemat JSON i sposób tworzenia deklaracji w stylu JSON.

Pobierz schemat JSON

Aby dowiedzieć się, jak edytować styl mapy za pomocą kodu JSON w edytorze stylów lub jak importować i eksportować styl mapy, przeczytaj artykuł Korzystanie z JSON w definiowaniu stylów map w Google Cloud.

Zobacz przykładową deklarację stylu JSON

Poniższa deklaracja stylu JSON ustawia kolor tła, a następnie definiuje style dla punktów orientacyjnych, parków i obiektów wodnych oraz ukrywa etykiety miejsc, w których można kupić jedzenie i napoje.


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

Obiekt JSON

Deklaracja stylu JSON składa się z obiektu najwyższego poziomu i tablicy reguł stylu.

Ustawienia najwyższego poziomu (opcjonalne) – globalne ustawienia stylu, np. backgroundColor i variant.
styles – tablica obiektów reguł stylu, która może zawierać te elementy:
- id – element mapy, który ma zostać wybrany do zmodyfikowania stylu (np. pointOfInterest.recreation.park).
- geometry (opcjonalnie) – elementy geometryczne elementu mapy i reguły stylu do zastosowania (np. fillColor).
- label (opcjonalnie) – tekst lub etykieta pinezki elementu mapy oraz reguły stylu do zastosowania (np. textStrokeColor).

Ustawienia najwyższego poziomu

Właściwości w tej tabeli dotyczą całego stylu mapy.

Właściwość	Typ	Opis	Przykład
`backgroundColor`	Ciąg znaków	Dostosuj kolor tła aplikacji Mapy za pomocą ciągu szesnastkowego #RRGGBB. To ustawienie nie obsługuje zmian krycia.	„#002211”
`variant`	„light”\|„dark”	Określ tryb jasny lub ciemny. Jeśli nie określisz tu żadnej wartości, zostanie użyte ustawienie domyślne „light”.	„light”
`monochrome`	Wartość logiczna	Aby włączyć tryb monochromatyczny, użyj ikony `true`, aby wyświetlić mapę w odcieniach szarości.	`true`

Obiekty reguł stylu

W tej sekcji opisano właściwości, które definiują obiekty reguł stylu w tablicy styles, aby dostosować elementy mapy. Każdy obiekt reguły stylu musi składać się z tych elementów:

id usługi.
geometry lub label z określonymi właściwościami stylizatora.

`id` (element mapy)

Właściwość id określa element mapy, do którego ma zostać zastosowany styl. Nazwy właściwości to wersje nazw funkcji mapy w edytorze stylów zapisane w formacie camel case.

Elementy mapy tworzą drzewo kategorii. Jeśli określisz typ funkcji nadrzędnej, np. pointOfInterest, style określone dla funkcji nadrzędnej będą stosowane do wszystkich jej funkcji podrzędnych, np. pointOfInterest.retail i pointOfInterest.lodging. Więcej informacji znajdziesz w artykule Mapowanie hierarchii funkcji.

Lista dostępnych właściwości `id`

Dostępne właściwości 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

Elementy

Elementy to podziały elementu mapy. Na przykład droga składa się z linii graficznej (geometry) na mapie oraz tekstu oznaczającego jej nazwę (label).

Dostępne są te elementy, ale pamiętaj, że konkretna funkcja mapy może obsługiwać niektóre z nich, wszystkie lub żadne:

geometry: wybiera wszystkie elementy geometryczne (np. wielokąt, linię łamaną) określonego elementu mapy.
label: wybiera wszystkie elementy etykiety (np. tekst, pinezkę) określonego elementu mapy.

Parownice

Stylisty to sposób definiowania reguł stylu dla każdego elementu funkcji mapy.

Na przykład w przypadku obrysu budynku możesz zastosować te style do poszczególnych elementów:

Przykładowe style `geometry` dla budynku	Przykładowe style `label` dla budynku
Określa, czy wielokąt przedstawiający obrys budynku ma być widoczny na mapie.	czy etykieta budynku ma być widoczna czy ukryta.
kolor i przezroczystość wypełnienia wielokąta;	kolor i przezroczystość wypełnienia tekstu;
kolor, przezroczystość i szerokość obramowania;	kolor i przezroczystość konturu tekstu;

W tej sekcji opisujemy różne opcje stylu dostępne dla elementów geometry i label.

`geometry` stylistów

W tabeli poniżej znajdziesz wszystkie dostępne style geometryczne.

Styler	Typ	Opis
`visible`	Wartość logiczna	Aby ukryć wielokąt lub polilinię elementu mapy, ustaw wartość `false`.
`fillColor`	ciąg znaków	Dostosuj kolor wielokąta lub polilinii za pomocą ciągu szesnastkowego RGB.
`fillOpacity`	liczba zmiennoprzecinkowa	Dostosuj przezroczystość wielokąta lub polilinii, gdzie 0 oznacza przezroczystość, a 1 – nieprzezroczystość.
`strokeColor`	ciąg znaków	Dostosuj kolor konturu za pomocą szesnastkowego ciągu RGB.
`strokeOpacity`	liczba zmiennoprzecinkowa	Dostosuj nieprzezroczystość konturu, gdzie 0 oznacza przezroczystość, a 1 – nieprzezroczystość.
`strokeWeight`	liczba zmiennoprzecinkowa	Dostosuj grubość konturu w zakresie od 0 do 8.

Więcej informacji znajdziesz w artykule Wielokąty i linie łamane.

`label` stylistów

W tabeli poniżej znajdziesz wszystkie dostępne style etykiet.

Styler	Typ	Opis
`visible`	Wartość logiczna	Aby ukryć etykietę obiektu na mapie, ustaw wartość `false`.
`textFillColor`	ciąg znaków	Dostosuj kolor etykiety tekstowej za pomocą szesnastkowego ciągu RGB.
`textFillOpacity`	liczba zmiennoprzecinkowa	Dostosuj nieprzezroczystość etykiety tekstowej, gdzie 0 oznacza przezroczystość, a 1 – nieprzezroczystość.
`textStrokeColor`	ciąg znaków	Dostosuj kolor konturu za pomocą szesnastkowego ciągu RGB.
`textStrokeOpacity`	liczba zmiennoprzecinkowa	Dostosuj nieprzezroczystość konturu, gdzie 0 oznacza przezroczystość, a 1 – nieprzezroczystość.
`textStrokeWeight`	liczba zmiennoprzecinkowa	Dostosuj grubość konturu w zakresie od 0 do 8.
`pinFillColor`	ciąg znaków	Dostosuj kolor pinezki za pomocą szesnastkowego ciągu RGB.

Więcej informacji znajdziesz w sekcji Ikony i etykiety tekstowe.

Klawisze powiększenia

Możesz ustawić jeden styl dla funkcji na wszystkich poziomach powiększenia lub określić różne style dla różnych poziomów powiększenia. Jeśli podasz tylko jeden styl, będzie on używany na wszystkich poziomach powiększenia początkowego od z0. Jeśli podasz style dla różnych poziomów powiększenia, styl będzie stosowany od tego poziomu powiększenia do następnego zdefiniowanego poziomu.

Aby ustawić poziom zoomu początkowego dla stylu, w właściwości stylizatora zdefiniuj poziom zoomu początkowego od z0 do z22, a następnie dostosowanie stylizatora.

W tym przykładzie kolor wody jest czarny na poziomach powiększenia 0–5, ciemnoszary na poziomach 6–11 i jasnoszary od poziomu 12.

{
  "id": "natural.water",
  "geometry": {
    "fillColor": {
      "z0": "#000000",
      "z6": "#666666",
      "z12": "#cccccc"
    }
  }
}

Więcej informacji znajdziesz w sekcji Poziomy powiększenia stylu.

Ograniczenia

Za pomocą JSON-a możesz określić styl niemal wszystkich elementów w konsoli Google Cloud, z wyjątkiem tych funkcji z menu Ustawienia mapy:

W przypadku tych funkcji musisz wybrać preferencje w menu Ustawienia mapy.