Поле symbolType и symbolSize

В системах декларативной визуализации данных Vega и Vega-Lite точечные маркеры играют центральную роль при построении диаграмм рассеяния, плотностных облаков, индикаторов событий и компактных сравнительных графиков. Основой таких маркеров являются символы (symbols), которые задаются через тип формы и размер.

В Vega управление символами осуществляется через mark "symbol", а в Vega-Lite — через mark "point" с абстракцией параметров формы и размера.

Vega: mark symbol, symbolType и symbolSize

В спецификации Vega базовым графическим примитивом для точек выступает mark:

{
  "type": "symbol"
}

Этот mark поддерживает два ключевых параметра визуализации:

  • symbolType — тип геометрической формы символа
  • size — площадь символа в пикселях

symbolType

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

  • "circle"
  • "square"
  • "triangle-up"
  • "triangle-down"
  • "diamond"
  • "cross"
  • "star"

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

Пример:

{
  "type": "symbol",
  "encode": {
    "enter": {
      "shape": { "value": "diamond" }
    }
  }
}

В современных версиях Vega чаще используется поле shape, которое фактически выполняет роль symbolType через систему шкал.

symbolSize

symbolSize задаёт площадь символа в пикселях, а не радиус. Это критически важно при масштабировании визуализаций.

{
  "type": "symbol",
  "encode": {
    "enter": {
      "size": { "value": 200 }
    }
  }
}

Особенность интерпретации:

  • значение соответствует площади
  • визуальный радиус пропорционален квадратному корню из size
  • увеличение значения приводит к квадратичному росту площади

Формально:

A = s

где A — площадь символа, s — значение symbolSize.

Следствие:

r

Это означает, что удвоение symbolSize не удваивает радиус визуального маркера.

Vega-Lite: абстракция point, shape и size

Vega-Lite упрощает работу с символами, скрывая низкоуровневую настройку symbolType и symbolSize за более декларативными полями.

Основной mark:

{
  "mark": "point"
}

shape как аналог symbolType

В Vega-Lite параметр формы задаётся через shape в encoding:

{
  "mark": "point",
  "encoding": {
    "shape": {
      "field": "category",
      "type": "nominal"
    }
  }
}

Значения формы соответствуют тем же геометрическим типам, что и в Vega:

  • circle
  • square
  • cross
  • diamond
  • triangle-up
  • triangle-down
  • star

При этом Vega-Lite автоматически создаёт шкалу соответствия категорий и форм.

size как аналог symbolSize

Размер точки задаётся через encoding:

{
  "mark": "point",
  "encoding": {
    "size": {
      "field": "value",
      "type": "quantitative"
    }
  }
}

В отличие от Vega, где размер задаётся напрямую, Vega-Lite может:

  • масштабировать size через шкалы
  • нормализовать значения
  • применять логарифмические и линейные преобразования

Фактически Vega-Lite компилирует size в Vega symbolSize.

Масштабирование и визуальная интерпретация

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

Если значение увеличивается линейно:

s_2 = 2s_1

то визуально радиус изменяется слабее ожидаемого:

r_2 = ,r_1

Это приводит к частым ошибкам интерпретации данных, особенно при сравнении категорий с близкими значениями.

Взаимосвязь shape и size

Комбинация формы и размера создаёт многомерное кодирование:

  • shape отвечает за категориальную различимость
  • size отвечает за количественную величину
  • color часто добавляет дополнительное измерение

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

{
  "mark": "point",
  "encoding": {
    "shape": { "field": "group", "type": "nominal" },
    "size": { "field": "value", "type": "quantitative" },
    "color": { "field": "group", "type": "nominal" }
  }
}

возникает тройное кодирование, где визуальная нагрузка распределяется между каналами восприятия.

Особенности трансляции Vega-Lite в Vega

При компиляции Vega-Lite в Vega происходит преобразование:

  • mark: "point" → mark: "symbol"
  • shape → encode.enter.shape
  • size → encode.enter.size

При этом:

  • Vega-Lite добавляет шкалы (scales) автоматически
  • категории преобразуются в диапазон символов
  • числовые значения нормализуются

Это делает Vega-Lite более высокоуровневым DSL над Vega.

Использование symbolType и shape в кастомных визуализациях

В Vega прямое управление symbolType полезно в следующих сценариях:

  • фиксированные маркеры без данных (легенды)
  • визуальные индикаторы статусов
  • событийные диаграммы

В Vega-Lite shape используется, когда:

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

Ограничения и поведение рендеринга

Система символов имеет ряд особенностей:

  • слишком малые значения symbolSize могут приводить к потере различимости
  • слишком большие значения вызывают перекрытие и визуальный шум
  • некоторые формы (например, star) визуально менее стабильны при малых размерах

Рендеринг символов также зависит от:

  • devicePixelRatio
  • antialiasing движка Canvas/SVG
  • выбранного renderer (canvas vs svg)

Геометрическая интерпретация size

Размер символа в Vega связан с площадью круга, эквивалентного по визуальному восприятию. Для окружности:

s = r^2

Отсюда радиус выражается как:

r =

Это объясняет, почему визуальные различия между значениями становятся менее интуитивными при больших диапазонах данных.

Практика комбинирования символов в плотных данных

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

  • уменьшение symbolSize
  • jittering координат
  • прозрачность (opacity)
  • агрегация данных

Особенно важно учитывать, что уменьшение size влияет на читаемость быстрее, чем линейное уменьшение воспринимаемой плотности.

Семантика формы в аналитических представлениях

Форма символа часто используется как вторичный канал кодирования:

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

В этом контексте symbolType или shape становится дискретным пространством визуальных категорий, независимым от количественного измерения symbolSize.

Оглавление