Справочник JSON по стилизации облачных карт

Выберите платформу: Android iOS JavaScript Веб-сервис

JSON-схема для стилизации облачных карт позволяет использовать JSON для настройки карт так же, как и через интерфейс редактора стилей. В этом документе описывается 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 ).

Настройки верхнего уровня

Свойства, указанные в следующей таблице, применяются ко всему стилю карты.

Свойство Тип Описание Пример

backgroundColor

 Нить Настройте цвет фона приложения карты с помощью шестнадцатеричной строки #RRGGBB. Эта настройка не поддерживает изменение прозрачности. "#002211"

variant

 «свет»|«тьма» Укажите светлый или темный режим. Если не указано, по умолчанию используется «светлый». "свет"

monochrome

 логический Чтобы включить монохромный режим, используйте true для отображения карты в сером цвете.

true

Объекты правил стиля

В этом разделе описываются свойства, определяющие объекты правил стиля в массиве styles для настройки объектов карты. Каждый объект правила стиля должен состоять из следующих элементов:

  • свойство id .
  • geometry или элемент label с определенными соответствующими свойствами стиля.

id (объект карты)

Свойство id указывает, какой объект карты нужно стилизовать. Названия свойств представляют собой версии названий объектов карты в редакторе стилей, записанные в стиле camelcase.

Объекты карты образуют древовидную структуру категорий. Если вы укажете родительский тип объекта, например 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 стилисты

В таблице ниже перечислены все доступные геометрические стилусы.

Стайлер Тип Описание

visible

 логический Чтобы скрыть полигон или ломаную линию объекта карты, установите значение false .

fillColor

 нить Настройте цвет многоугольника или ломаной линии с помощью шестнадцатеричной строки RGB.

fillOpacity

 плавать Настройте прозрачность многоугольника или ломаной линии, где 0 означает прозрачность, а 1 — непрозрачность.

strokeColor

 нить Настройте цвет контура с помощью шестнадцатеричной строки RGB.

strokeOpacity

 плавать Настройте прозрачность контура, где 0 — прозрачный, а 1 — непрозрачный.

strokeWeight

 плавать Настройте толщину контура в диапазоне от 0 до 8.

Для получения более подробной информации см. разделы «Многоугольники» и «Полулинии» .

стилисты label

В таблице ниже перечислены все доступные средства для стилизации этикеток.

Стайлер Тип Описание

visible

 логический Чтобы скрыть метку объекта на карте, установите значение false .

textFillColor

 нить Настройте цвет текстовой метки с помощью шестнадцатеричной строки RGB.

textFillOpacity

 плавать Настройте прозрачность текстовой метки, где 0 означает прозрачность, а 1 — непрозрачность.

textStrokeColor

 нить Настройте цвет контура с помощью шестнадцатеричной строки RGB.

textStrokeOpacity

 плавать Настройте прозрачность контура, где 0 — прозрачный, а 1 — непрозрачный.

textStrokeWeight

 плавать Настройте толщину контура в диапазоне от 0 до 8.

pinFillColor

 нить Настройте цвет контакта с помощью шестнадцатеричной RGB-строки.

Для получения более подробной информации см. раздел «Значки и текстовые подписи» .

Keyzooms

Вы можете задать один стиль для объекта на всех уровнях масштабирования или указать разные стили для разных уровней масштабирования. Если вы укажете только один стиль, он будет использоваться для всех уровней масштабирования, начиная с z0. Если вы укажете стили для разных уровней масштабирования, стиль будет применяться с этого уровня масштабирования до следующего определенного вами уровня.

Чтобы задать уровень масштабирования клавиш для стиля, в свойствах стиля укажите уровень масштабирования клавиш от z0 до z22, а затем выполните настройку стиля.

В следующем примере цвет воды черный на уровнях масштабирования от 0 до 5, темно-серый на уровнях от 6 до 11 и светло-серый, начиная с уровня 12.

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

Для получения более подробной информации см. раздел «Уровни масштабирования стиля» .

Ограничения

В консоли Google Cloud можно использовать JSON для оформления практически всех элементов, за исключением следующих функций в меню «Настройки карты» :

Для использования этих функций необходимо выбрать предпочтительный вариант в меню карты» .