Конфигурация

{
  ...,
  "config": {                // Конфигурация
    ...,                     // Настройки верхнего уровня
    "axis"      : { ... },   // Настройки: оси
    "header"    : { ... },   // Настройки: заголовки панелей
    "legend"    : { ... },   // Настройки: легенды
    "mark"      : { ... },   // Настройки: примитивы
    "style"     : { ... },   // Настройки: стили
    "range"     : { ... },   // Настройки: выходные диапазоны шкал
    "scale"     : { ... },   // Настройки: шкалы
    "projection": { ... },   // Настройки: проекции
    "selection" : { ... },   // Настройки: выделения
    "title"     : { ... },   // Настройки: заголовок
    "view"      : { ... },    // Настройки: представление
    "concat"    : { ... },    // Настройки: объединение и повторение
    "facet"     : { ... },    // Настройки: панели
    "locale"    : { ... },    // Настройки: локаль
    "aria"      : ...        // Настройки: доступность ARIA
  }
}

Объект config задаёт значения по умолчанию для всей диаграммы. С его помощью можно создать единый стиль осей, легенд, примитивов, шкал и составных представлений. Объект config Vega-Lite включает конфигурацию базового языка Vega.

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

Общие свойства конфигурации

Свойство Тип Описание
autosize AutosizeType, AutoSizeParams Как определяется размер визуализации. Строка может быть "pad", "fit" или "none"; объект дополнительно задаёт параметры размера содержимого и автоматического изменения размеров. По умолчанию: "pad".
background Color, ExprRef CSS-цвет фона всего представления. По умолчанию: "white".
countTitle string Заголовок осей и легенд для полей count по умолчанию. По умолчанию: "Count of Records".
fieldTitle "verbal", "functional", "plain" Способ формирования заголовков полей: "verbal" (по умолчанию) — словесный, например "Sum of field", "Year-month of date", "field (binned)"; "functional" — имя функции прописными буквами со скобками, например "SUM(field)", "YEARMONTH(date)", "BIN(field)"; "plain" — только имя поля, например "field" или "date".
font string Шрифт по умолчанию для всех текстовых примитивов, заголовков и подписей.
lineBreak string, ExprRef Разделитель, например символ новой строки, по которому текст разбивается на несколько строк. Глобальное значение для текстовых примитивов переопределяется конфигурацией примитива или стиля и каналом кодирования lineBreak. Для значения, заданного сигналом, допустимы строка или регулярное выражение.
padding Padding, ExprRef Отступ по умолчанию в пикселях от края полотна до прямоугольника данных. Число задаёт одинаковый отступ со всех сторон, объект — отдельные отступы, например {"left": 5, "top": 5, "right": 5, "bottom": 5}. По умолчанию: 5.
tooltipFormat FormatConfig Особая конфигурация форматирования подсказок. Если не задана, применяется стандартная конфигурация форматов.

Форматы чисел и времени

Эти свойства влияют на текстовые примитивы, оси, заголовки панелей, легенды и подсказки:

Свойство Тип Описание
numberFormat string Если numberFormatType не задан, формат чисел D3 для подписей направляющих, текстовых примитивов и подсказок ненормированных полей (без stack: "normalize"). Например, "s" задаёт единицы СИ; используются шаблоны d3-format. Если config.numberFormatType задан и config.customFormatTypes равен true, это значение передаётся как format вместе с datum.value в функцию config.numberFormatType.
numberFormatType string Пользовательский тип форматирования для config.numberFormat. По умолчанию: undefined — вызов d3-format, доступного как format в выражениях Vega. Для использования необходимо customFormatTypes: true.
normalizedNumberFormat string Если normalizedNumberFormatType не задан, формат чисел D3 для подписей осей, текстовых примитивов и подсказок нормированных полей с укладкой (stack: "normalize"). Например, "s" задаёт единицы СИ; используются шаблоны d3-format. Если config.normalizedNumberFormatType задан и config.customFormatTypes равен true, это значение передаётся как format вместе с datum.value в функцию config.normalizedNumberFormatType. По умолчанию: "%".
normalizedNumberFormatType string Пользовательский тип форматирования для config.normalizedNumberFormat. По умолчанию: undefined — вызов d3-format, доступного как format в выражениях Vega. Для использования необходимо customFormatTypes: true.
timeFormat string Формат времени по умолчанию для исходных временных значений без timeUnit в текстовых примитивах, подписях легенд и заголовках панелей. По умолчанию: "%b %d, %Y". Примечание: оси определяют формат каждой подписи автоматически, эта настройка на них не влияет.
timeFormatType string Пользовательский тип форматирования для config.timeFormat. По умолчанию: undefined — вызов d3-time-format, доступного как timeFormat в выражениях Vega. Для использования необходимо customFormatTypes: true и отсутствие timeUnit.
customFormatTypes boolean Разрешает свойству formatType текстовых примитивов и направляющих принимать пользовательскую функцию форматирования, зарегистрированную как выражение Vega.

Собственная функция форматирования

(1) Зарегистрируйте функцию выражения Vega, принимающую значение данных и необязательные параметры формата:

vega.expressionFunction('customFormatA', function(datum, params) {
  ...
  return "<formatted string>";
});

(2) Задайте customFormatTypes: true:

{
  ...,
  "config": {"customFormatTypes": true}
}

(3) После этого используйте имя функции в formatType у текста или направляющих элементов:

{
  "format": <params>,
  "formatType": "customFormatA"
}

Отдельный формат для подсказок

Подсказка обычно располагает большим местом, чем подписи оси. Поэтому на диаграмме можно показывать короткий формат, а в подсказке — более точное число. В следующем примере ось y использует d без десятичных знаков, чтобы подписи не были слишком длинными, а подсказка — более точный .8f. Для этого добавьте свойство tooltipFormat, соответствующее типу FormatConfig:

Направляющие элементы

Оси

Объект axis задаёт свойства всех осей. Дополнительные блоки применяются по ориентации (axisX, axisY, axisLeft, axisTop и другие), типу шкалы (axisBand), типу данных (axisDiscrete, axisQuantitative, axisTemporal) или сочетанию ориентации и типа (например, axisXTemporal). axisBand действует только на шкалы band. Если к оси применимы несколько блоков, настройки по типу имеют приоритет над настройками по ориентации, а те — над общими. Подробнее — на странице «Ось».

Свойство Тип Описание
axis AxisConfig Конфигурация свойств по умолчанию всех осей x и y. Полный список — в конфигурации осей.
axisX AxisConfig Настройки осей x.
axisY AxisConfig Настройки осей y.
axisLeft AxisConfig Настройки оси y у левого края диаграммы.
axisRight AxisConfig Настройки оси y у правого края диаграммы.
axisTop AxisConfig Настройки оси x у верхнего края диаграммы.
axisBottom AxisConfig Настройки оси x у нижнего края диаграммы.
axisBand AxisConfig Настройки осей со шкалами band.
axisPoint AxisConfig Настройки осей со шкалами point.
axisDiscrete AxisConfig Настройки осей со шкалами point или band.
axisQuantitative AxisConfig Настройки количественных осей.
axisTemporal AxisConfig Настройки временных осей.
axisXBand AxisConfig Настройки осей x со шкалами band.
axisXPoint AxisConfig Настройки осей x со шкалами point.
axisXDiscrete AxisConfig Настройки осей x со шкалами point или band.
axisXQuantitative AxisConfig Настройки осей x для количественных данных.
axisXTemporal AxisConfig Настройки осей x для временных данных.
axisYBand AxisConfig Настройки осей y со шкалами band.
axisYPoint AxisConfig Настройки осей y со шкалами point.
axisYDiscrete AxisConfig Настройки осей y со шкалами point или band.
axisYQuantitative AxisConfig Настройки осей y для количественных данных.
axisYTemporal AxisConfig Настройки осей y для временных данных.

Заголовки панелей

Свойство Тип Описание
header HeaderConfig Конфигурация свойств по умолчанию всех заголовков панелей. Полный список — в конфигурации заголовков.

Легенды

Свойство Тип Описание
legend LegendConfig Конфигурация свойств по умолчанию всех легенд. Полный список — в конфигурации легенд.

Встроенные стили направляющих элементов

  • "guide-label" — подписи осей, легенд и панелей;
  • "guide-title" — их названия;
  • "group-title" — заголовки диаграмм.

Подробнее об именованных стилях — на странице «Графические примитивы».

Графические примитивы

config.mark действует для всех примитивов. Блок с именем типа, например config.area, задаёт значения по умолчанию только для этого типа.

Свойство Тип Описание
mark MarkConfig Конфигурация графических примитивов.
area AreaConfig Настройки, специфичные для областей.
bar BarConfig Настройки, специфичные для столбцов.
circle MarkConfig Настройки, специфичные для кругов.
line LineConfig Настройки, специфичные для линий.
point MarkConfig Настройки, специфичные для точек.
rect RectConfig Настройки, специфичные для прямоугольников.
geoshape MarkConfig Настройки, специфичные для географических фигур.
rule MarkConfig Настройки, специфичные для линий rule.
square MarkConfig Настройки, специфичные для квадратов.
text MarkConfig Настройки, специфичные для текста.
tick TickConfig Настройки, специфичные для штрихов.

Именованные стили

config.style определяет наборы свойств, которые затем выбираются по имени в объекте примитива или оси. Это позволяет единообразно оформлять несколько элементов. Пример находится в разделе о стилях примитивов.

Свойство Тип Описание
style StyleConfigIndex Объект соответствия имён стилей свойствам примитивов по умолчанию. Ключи — имена стилей, значения — допустимые объекты конфигурации примитивов.

Шкалы и цветовые диапазоны

Свойство Тип Описание
scale ScaleConfig Конфигурация свойств по умолчанию всех шкал. Полный список — в конфигурации шкал.
range RangeConfig Объект массивов или схем выходных диапазонов шкал по умолчанию. Полный список — в конфигурации шкал.

Географическая проекция

Свойство Тип Описание
projection ProjectionConfig Конфигурация свойств по умолчанию всех проекций. Полный список — в конфигурации проекций.

Выделения

Свойство Тип Описание
selection SelectionConfig Объект свойств по умолчанию каждого типа выделения.

Заголовок диаграммы

Свойство Тип Описание
title TitleConfig Конфигурация свойств по умолчанию всех заголовков. Полный список — в конфигурации заголовка.

Представление и композиция

Свойство Тип Описание
view ViewConfig Свойства отдельных представлений по умолчанию.
concat CompositionConfig Конфигурация по умолчанию всех операторов объединения и повторения представлений: concat, hconcat, vconcat и repeat.
facet CompositionConfig Конфигурация по умолчанию оператора композиции facet.

Каждая конфигурация композиции (concat и facet) поддерживает следующие свойства:

Свойство Тип Описание
columns number Число столбцов в компоновке составного представления. По умолчанию: undefined — число столбцов не ограничено, все представления располагаются в один ряд. Для concat это эквивалентно hconcat, а для facet и repeat — использованию канала column. Примечания: 1) Свойство применяется только к оператору concat с переносом строк (не к hconcat/vconcat) и к операторам facet и repeat с одним определением поля или повторения, без вложенных определений row/column. 2) Значение columns: 1 эквивалентно vconcat для concat и использованию канала row для facet и repeat.
spacing number Расстояние по умолчанию между составными представлениями, в пикселях. По умолчанию: 20.

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

Настройки локали

Свойство Тип Описание
locale Locale Локаль для разбора строк и форматирования чисел и дат. Объект должен содержать number и/или time с определениями локали. Локаль конфигурации может быть переопределена параметром locale конструктора View.

Настройки ARIA

Свойство Тип Описание
aria boolean Включать ли стандартные атрибуты ARIA для примитивов и направляющих (только SVG). При false всем направляющим назначается aria-hidden, исключающий их из дерева доступности, и Vega-Lite не создаёт стандартные описания примитивов. По умолчанию: true.