Спецификация представления Vega-Lite

Спецификации Vega-Lite — объекты JSON, описывающие разнообразные интерактивные визуализации. Простейший вариант — спецификация одиночного представления, использующего один тип графических примитивов для отображения данных. Одиночное представление может быть самостоятельной визуализацией. Кроме того, Vega-Lite предоставляет операторы объединения нескольких представлений в слои или составные представления: layer, facet, concat и repeat.

Содержание страницы

• Общие свойства
• Свойства верхнего уровня
• Одиночное представление
• Фон области построения
  • Пример: фон
• Составные представления
• Конфигурация представления

Общие свойства спецификаций

Следующие свойства можно использовать в разных видах представлений:

Все спецификации объединения представлений (layer, facet, concat и repeat) также могут содержать свойство resolve, управляющее совместным использованием шкал, осей и легенд:

Операторы размещения представлений (facet, concat и repeat) могут иметь следующие свойства размещения:

Свойства верхнего уровня

Эти свойства относятся к визуализации целиком, будь то одиночная диаграмма или составное представление:

Одиночное представление

Типичная спецификация одной диаграммы выглядит так. Многоточия обозначают места для значений:

{
  // Свойства верхнего уровня
  "$schema": "https://vega.github.io/schema/vega-lite/v6.json",
  "background": ...,
  "padding": ...,
  "autosize": ...,
  "config": ...,
  "usermeta": ...,

  // Свойства любого представления
  "title": ...,
  "name": ...,
  "description": ...,
  "data": ...,
  "transform": ...,

  // Свойства одиночной диаграммы
  "width": ...,
  "height": ...,
  "mark": ...,
  "encoding": {
    "x": {
      "field": ...,
      "type": ...,
      ...
    },
    "y": ...,
    "color": ...,
    ...
  }
}

Одиночное представление описывает тип графического примитива mark, например point или bar, и его encoding — соответствие между значениями данных и свойствами примитивов. Достаточно задать тип примитива и кодирование, чтобы Vega-Lite автоматически создал остальные компоненты: оси, легенды и шкалы. Если их свойства не заданы явно, Vega-Lite определяет их по набору тщательно разработанных правил. Такой подход делает спецификации краткими и выразительными, сохраняя возможность настройки.

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

Помимо общих свойств, одиночная диаграмма может содержать:

Фон области построения

Свойство background на верхнем уровне окрашивает всю визуализацию. Свойство view задаёт фон только области построения одиночной диаграммы или слоя. Поэтому на одной странице они могут иметь разные цвета.

Пример: фон

В примере оранжевый цвет задан для всей визуализации, а жёлтый — для области построения:

Составные представления

Чтобы создавать многослойные и составные визуализации, обратитесь к следующим страницам:

• layer
• facet
• concat
• repeat

Конфигурация представления

В объекте config.view задаются значения по умолчанию для области построения. Здесь можно настроить заливку и обводку из таблицы выше, кроме свойства style, а также исходные размеры:

// Спецификация представления верхнего уровня
{
  ...,
  "config": { // Объект конфигурации

    "view": { // Конфигурация представления

      // Размер представления
      "continuousWidth": ...,
      "continuousHeight": ...,
      "discreteWidth": ...,
      "discreteHeight": ...,
      // Свойства фона представления
      "fill": ...,
      "stroke": ...,
      ...
    },
    ...
  }
}

В этом примере свойство step меняет размер шага для дискретного поля:

Подробнее о размерах представлений читайте в документации size.