Условные выражения

В системе стилей Mapbox GL JS условные выражения представляют собой основу динамического управления отображением слоёв. Они позволяют формировать поведение визуализации на основе свойств данных, масштаба карты, состояния элементов и других параметров, задаваемых векторными тайлами или GeoJSON-источниками. Вместо фиксированных значений свойства слоя становятся вычисляемыми конструкциями, интерпретируемыми движком рендеринга.

Выражения в Mapbox GL JS имеют функциональный формат, где каждый оператор задаётся массивом. Первый элемент определяет тип операции, последующие — аргументы. Такая модель обеспечивает строгую предсказуемость и позволяет строить вложенные логические структуры без потери производительности.

Логическая модель выражений

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

Базовые элементы:

  • операции сравнения (==, !=, >, <, >=, <=)
  • логические операторы (!, all, any)
  • условные конструкции (case, match)
  • вспомогательные функции (coalesce, in, has)

Каждое выражение возвращает результат, который может быть числом, строкой, цветом или массивом.

Операции сравнения

Сравнение значений — фундамент условной логики. Оно применяется для проверки свойств объектов или параметров карты.

Примеры:

["==", ["get", "type"], "park"]

Проверка равенства значения свойства type строке "park".

[">", ["get", "population"], 100000]

Проверка числового превышения значения.

["!=", ["get", "status"], "inactive"]

Неравенство используется для исключения категорий объектов.

Сравнения часто комбинируются с логическими операторами, формируя сложные условия.

Логические операторы

Логические выражения позволяют объединять несколько условий в единый блок.

Оператор all

Возвращает true, если все условия истинны:

["all",
  [">", ["get", "population"], 50000],
  ["==", ["get", "type"], "city"]
]

Используется для строгого отбора объектов.

Оператор any

Возвращает true, если хотя бы одно условие истинно:

["any",
  ["==", ["get", "type"], "city"],
  ["==", ["get", "type"], "town"]
]

Подходит для объединения категорий.

Оператор !

Инвертирует результат выражения:

["!", ["==", ["get", "status"], "active"]]

Позволяет исключать определённые классы объектов.

Условное выражение case

Оператор case реализует цепочку условий, аналогичную конструкции if–else if–else.

Синтаксис:

["case",
  условие1, результат1,
  условие2, результат2,
  результат_по_умолчанию
]

Пример использования:

["case",
  ["==", ["get", "type"], "water"], "#0000ff",
  ["==", ["get", "type"], "forest"], "#00ff00",
  "#cccccc"
]

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

Особенность case заключается в последовательной проверке условий: первое истинное условие останавливает дальнейшее вычисление.

Оператор match

match используется для сопоставления значения с набором вариантов. Он эффективнее, чем цепочка case, когда сравнение происходит с дискретными значениями.

Синтаксис:

["match",
  выражение,
  значение1, результат1,
  значение2, результат2,
  значение_по_умолчанию
]

Пример:

["match",
  ["get", "class"],
  "highway", "#ff0000",
  "primary", "#ffa500",
  "secondary", "#ffff00",
  "#999999"
]

Особенность match — прямое сопоставление без необходимости задавать отдельные логические условия.

Проверка наличия и работа с отсутствующими значениями

Векторные данные часто содержат неполные свойства. Для этого используются специальные функции.

coalesce

Возвращает первое определённое значение:

["coalesce",
  ["get", "name_en"],
  ["get", "name"],
  "unknown"
]

Используется для безопасной работы с языковыми и альтернативными полями.

has

Проверяет наличие свойства:

["has", "population"]

get с fallback-логикой

Комбинация get и coalesce часто используется для предотвращения ошибок при отсутствии данных.

Вложенные условные выражения

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

Пример:

["case",
  ["all",
    [">", ["get", "population"], 100000],
    ["==", ["get", "type"], "city"]
  ],
  "#ff0000",

  ["all",
    [">", ["get", "population"], 50000],
    ["==", ["get", "type"], "town"]
  ],
  "#ffa500",

  "#cccccc"
]

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

Условные выражения с масштабом карты

Mapbox GL JS поддерживает использование масштаба (zoom) как параметра условий.

Пример:

["interpolate",
  ["linear"],
  ["zoom"],
  5, 1,
  10, 2,
  15, 5
]

Хотя это не чисто условное выражение, оно часто комбинируется с case и match.

Пример условного масштаба:

["case",
  [">", ["zoom"], 12],
  2,
  1
]

Комбинирование условий с типами данных

Условные выражения работают с различными типами значений:

  • строки (категории объектов)
  • числа (метрики, статистика)
  • булевы значения (флаги)
  • цвета (hex, rgba)
  • массивы (геометрические данные)

Пример цветового условного выражения:

["match",
  ["get", "landuse"],
  "residential", "#f2f2f2",
  "commercial", "#e0e0e0",
  "industrial", "#d0d0d0",
  "#ffffff"
]

Практика построения многоуровневой логики

Сложные стили часто строятся как комбинация нескольких уровней условий:

  1. проверка наличия данных
  2. проверка категории объекта
  3. проверка числовых порогов
  4. применение масштабного фактора

Пример:

["case",
  ["!=", ["get", "population"], null],
  ["case",
    [">", ["get", "population"], 1000000], "#800026",
    [">", ["get", "population"], 500000], "#bd0026",
    "#e31a1c"
  ],
  "#cccccc"
]

Такой подход позволяет выстраивать детализированную визуальную иерархию.

Ошибки и особенности интерпретации

Условные выражения в Mapbox GL JS требуют строгого соблюдения синтаксиса:

  • отсутствие запятой между аргументами массива недопустимо
  • порядок условий критически важен
  • типы данных должны быть согласованы
  • null и отсутствие значения обрабатываются отдельно

При некорректной структуре выражение либо игнорируется, либо возвращает значение по умолчанию.

Производительность условных выражений

Выражения интерпретируются на уровне рендеринга карты, поэтому их эффективность влияет на производительность слоя. Наиболее оптимизированные конструкции:

  • match вместо длинных цепочек case
  • минимальная глубина вложенности
  • использование числовых диапазонов вместо множества сравнений
  • предварительная нормализация данных в источнике

Избыточно сложные выражения увеличивают нагрузку на GPU и могут замедлять отрисовку при большом количестве объектов.

Использование условных выражений в стилях слоёв

Условные выражения применяются во всех типах слоёв:

  • fill — заливка полигонов
  • line — линии дорог и маршрутов
  • circle — точечные объекты
  • symbol — подписи и иконки

Пример для слоя символов:

"text-color": ["case",
  ["==", ["get", "type"], "city"], "#000000",
  "#666666"
]

Пример для линий:

"line-width": ["interpolate",
  ["linear"],
  ["zoom"],
  5, 0.5,
  10, 2,
  15, 6
]

Сложные композиции логики отображения

При проектировании картографических стилей условные выражения становятся инструментом построения визуальной семантики данных. Они позволяют:

  • выделять важные объекты
  • подавлять второстепенные элементы
  • формировать иерархии отображения
  • адаптировать стиль под масштаб и плотность данных

Комбинированные выражения объединяют фильтрацию, классификацию и визуальное кодирование в единую систему вычислений внутри стиля карты.

Оглавление