Поле concat, facet, repeat

Поле concat в Vega-Lite используется для последовательного объединения нескольких независимых спецификаций в единую композицию. Оно позволяет располагать графики в виде сетки по строкам или столбцам, сохраняя при этом автономность каждого подграфика.

Базовая идея concat заключается в том, что каждая вложенная спецификация остаётся полноценной визуализацией со своими данными, масштабами и осями.

Горизонтальная конкатенация

{
  "data": {"url": "data.csv"},
  "concat": [
    {
      "mark": "bar",
      "encoding": {
        "x": {"field": "category", "type": "nominal"},
        "y": {"field": "value", "type": "quantitative"}
      }
    },
    {
      "mark": "line",
      "encoding": {
        "x": {"field": "category", "type": "nominal"},
        "y": {"field": "value", "type": "quantitative"}
      }
    }
  ]
}

Каждый элемент массива concat размещается слева направо. Это удобно для сравнения разных типов визуализации одного и того же набора данных.

Вертикальная конкатенация

Вертикальное расположение достигается добавлением вложенных объектов:

{
  "vconcat": [
    {
      "mark": "line",
      "encoding": {
        "x": {"field": "date", "type": "temporal"},
        "y": {"field": "price", "type": "quantitative"}
      }
    },
    {
      "mark": "area",
      "encoding": {
        "x": {"field": "date", "type": "temporal"},
        "y": {"field": "volume", "type": "quantitative"}
      }
    }
  ]
}

concat и его специализированные формы (vconcat, hconcat) представляют базовый механизм композиции без семантической зависимости между графиками.

facet: разбиение данных по категориям

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

Базовая структура facet

{
  "data": {"url": "data.csv"},
  "facet": {
    "row": {"field": "region", "type": "nominal"}
  },
  "spec": {
    "mark": "bar",
    "encoding": {
      "x": {"field": "category", "type": "nominal"},
      "y": {"field": "value", "type": "quantitative"}
    }
  }
}

Здесь создаётся набор одинаковых графиков, каждый из которых соответствует отдельному значению region.

Двумерное разбиение

{
  "facet": {
    "row": {"field": "region", "type": "nominal"},
    "column": {"field": "year", "type": "temporal"}
  },
  "spec": {
    "mark": "line",
    "encoding": {
      "x": {"field": "month", "type": "ordinal"},
      "y": {"field": "value", "type": "quantitative"}
    }
  }
}

Такое разбиение создаёт матрицу графиков, где строки и столбцы определяются двумя независимыми измерениями.

Особенности facet

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

repeat: повторение визуализации по полям данных

Поле repeat в Vega-Lite позволяет автоматически дублировать одну и ту же визуализацию для нескольких полей данных. В отличие от facet, который делит строки, repeat изменяет само поле данных внутри одной и той же спецификации.

Повтор по колонкам

{
  "data": {"url": "data.csv"},
  "repeat": {
    "column": ["sales", "profit", "cost"]
  },
  "spec": {
    "mark": "line",
    "encoding": {
      "x": {"field": "date", "type": "temporal"},
      "y": {"field": {"repeat": "column"}, "type": "quantitative"}
    }
  }
}

Каждая колонка становится отдельным графиком, где меняется только поле y.

Повтор по строкам

{
  "repeat": {
    "row": ["temperature", "humidity"]
  },
  "spec": {
    "mark": "area",
    "encoding": {
      "x": {"field": "time", "type": "temporal"},
      "y": {"field": {"repeat": "row"}, "type": "quantitative"}
    }
  }
}

Комбинированный repeat

{
  "repeat": {
    "row": ["a", "b"],
    "column": ["x", "y"]
  },
  "spec": {
    "mark": "point",
    "encoding": {
      "x": {"field": {"repeat": "column"}, "type": "quantitative"},
      "y": {"field": {"repeat": "row"}, "type": "quantitative"}
    }
  }
}

Формируется сетка графиков, где каждая ячейка соответствует комбинации полей.

Сравнение concat, facet и repeat

concat

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

facet

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

repeat

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

Вложенные композиции

В Vega (data visualization grammar) и Vega-Lite поддерживаются комбинированные структуры, где concat, facet и repeat могут использоваться совместно.

facet внутри concat

{
  "concat": [
    {
      "facet": {
        "row": {"field": "group", "type": "nominal"}
      },
      "spec": {
        "mark": "bar",
        "encoding": {
          "x": {"field": "category", "type": "nominal"},
          "y": {"field": "value", "type": "quantitative"}
        }
      }
    },
    {
      "mark": "line",
      "encoding": {
        "x": {"field": "date", "type": "temporal"},
        "y": {"field": "value", "type": "quantitative"}
      }
    }
  ]
}

repeat внутри facet

{
  "facet": {
    "row": {"field": "segment", "type": "nominal"}
  },
  "spec": {
    "repeat": {
      "column": ["metric1", "metric2"]
    },
    "spec": {
      "mark": "line",
      "encoding": {
        "x": {"field": "time", "type": "temporal"},
        "y": {"field": {"repeat": "column"}, "type": "quantitative"}
      }
    }
  }
}

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

Масштабы и синхронизация

При использовании concat, facet и repeat ключевым аспектом становится управление масштабами:

  • shared scales: единые оси для всех подграфиков
  • independent scales: отдельные оси для каждой панели
  • частичная синхронизация (например, общий X, независимый Y)

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

Практические паттерны использования

Панель сравнения метрик

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

  • выручка
  • прибыль
  • затраты

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

Категориальная аналитика

facet применяется для сегментации:

  • регионы
  • категории товаров
  • временные периоды

Гибридные дашборды

concat используется для объединения:

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

Ограничения и особенности производительности

  • facet с большим числом категорий может приводить к экспоненциальному росту DOM-элементов
  • repeat увеличивает количество вычислений масштабов при каждом изменении данных
  • concat требует ручного контроля согласованности осей
  • вложенные композиции усложняют оптимизацию рендеринга

Оптимизация обычно достигается через:

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

Архитектурная роль композиционных полей

concat, facet и repeat формируют базовый слой композиционной модели в Vega-Lite. Они определяют:

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