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

Для настройки представления данных в нескольких разрезах и размещения агрегированных значений по «Строкам» / «Столбцам» предназначены «Полки»:

• полка «Значения» — полка для размещения результирующих значений;
• полка «Строки» — полка для размещения полей в строках;
• полка «Столбцы» — полка для размещения полей в столбцах;
• полка «Детализация» — полка для размещения полей, по которым необходима детализация. При добавлении полей на полку «Детализация строк», в Сводной таблице рядом с колонкой «Строки» справа появляется одна или несколько колонок. В этих колонках  отображаются данные, детализирующие информацию по самому правому полю с полки «Строки»;

• полка «Фильтры» — полка для размещения полей, которые будут использоваться в качестве фильтров;
• полка «Дополнительно» — полка для размещения полей, которые будут доступны пользователю в режиме просмотра для возможного дополнения других полок таблицы без соответствующих настроек в режиме конструктора (см. рисунок ниже). Значения полки «Дополнительно» будут доступны для выбора в выпадающем боковом списке сводной таблицы

Значения, строки и колонки поддерживают работу вычисляемых полей.

Общие настройки

В общих настройках заполните поля:

• «Заголовок» — включите переключатель при необходимости отображения заголовка, заполните поле;
• «Цвет фона» — выберите цвет для фона компонента;
• «Подзаголовок» — введите значение подзаголовка, данное поле доступно только при включенном переключателе «Заголовок»;
• «Заголовок группировки строк» — укажите произвольное название столбца с группировкой строк. Если заголовок длинный, то при наведении на него отобразится всплывающая подсказка с полным наименованием;
• «Точность чисел» — установите значение точности чисел (числа после точки);
• «Формат даты» — выберите из выпадающего списка формат отображения значения даты;
• «Скрыть заголовок значений» — при включении переключателя у колонок будет скрыт заголовок;
• «Нумерация строк» — при включении переключателя в таблице отобразиться нумерация строк. Если в таблице используется классическая тема, то на строки с промежуточными итогами нумерация не распространяется. При активной опции отобразятся дополнительные поля:
  
  • «Ширина столбца нумерации» — установите значение ширины столбца;
  • «Шаблон нумерации» — по умолчанию установлено значение «1.  1.1.  1.1.1.  Многоуровневая нумерация». Выберите из выпадающего списка одно из значений: 
    • 1  2  3 —  первый уровень;
    • 1.  2.  3.  — первый уровень;
    • 1)  2)  3) — первый уровень;
    • a)  b)  c)  — первый уровень;
    • 1.  1.1.  1.1.1.  Многоуровневая нумерация.

Управление итогами (раздел «Итоги»)

При настройке сводной таблицы можно управлять видимостью и положением итогов, для этого в настройках таблицы добавлен раздел «Итоги». Раздел позволяет работать с полями:

• «Закрепить общие итоги» — если включить переключатель, то при скролле таблицы итоги будут закреплены
• «Строки» — в данном пункте отображаются поля для настройки строк:
  • «Общие итоги слева» —  если включить переключатель, то итог будет отображаться во втором по счету столбце;
    
  • «Скрыть общие итоги по строкам» —  если включить переключатель, то итог по строкам будет скрыт.
• «Колонки» —  в данном пункте отображаются поля для настройки колонок (столбцов):
  • «Общие итоги сверху» —  если включить переключатель, то общие итоги будут отображаться сверху;
    
  • «Скрыть общие итоги по колонкам» —  если включить переключатель, то итоги по колонкам будут скрыты;
  • «Скрыть итоги по колонкам» —  если включить переключатель, то будет скрыт итог по колонкам.

Раздел «Настройка полей»

Сводная таблица позволяет выполнить настройку каждого поля по отдельности в разделе «Настройка полей». Для настройки выберите из выпадающего списка поле, относящееся к полке (Значения, Строки, Детализация, Столбцы, Дополнительно).

Раздел позволяет для всех полей:

• установить ширину поля в пикселях  в поле «Ширина»;
• установить формат даты в поле «Формат даты»;
• установить префикс к значению в поле «Суффиксы значений».

Для полей с полки «Строки» отображаются дополнительные поля:

• «Цвет фона» — поле позволяет настроить фон отдельно для разных уровней строк. Если добавлены поля в полку Детализация, то их цвет фона окрасится в цвет фона первого поля полки Строки;
• «Цвет текста» — поле позволяет настроить цвет текста для разных уровней строк. Если добавлены поля в полку Детализация, то их цвет текста окрасится в цвет фона первого поля полки Строки;
• «Размер шрифта» — поле позволяет настроить цвет текста для разных уровней строк в px.
• «Поиск» — при включении данного переключателя на соответствующих столбцах сводной таблицы появляется кнопка «Поиск».

При включении опции «Поиск» и нажатии на кнопку поиска отображается выпадающий список, в котором будут доступны поля с полки Строки. По умолчанию отображается поле самого верхнего уровня. В выпадающем списке также представлено поле поиска, а также возможность выбрать все значения за раз при помощи кнопки «Выбрать всё».

Для полей с полки «Детализация» отображаются поля, представленные на рисунке ниже:

 

Раздел «Стилизация»

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

Классический стиль таблицы:

Облегченный стиль таблицы:

Настройка стиля устанавливается в разделе «Стилизация»:

• «Тема» — при установке значения «по умолчанию» отобразиться классический стиль. А если установить значение «Light», то будет облегченный стиль таблицы;
• «Цвет линий» — выберите цвет для линий;
• «Выравнивание по левому краю» — если включить переключатель, то значения таблицы будут выравниваться по левому краю;
• «Тип шрифта» — выберите шрифт из выпадающего списка для текста таблицы;
• «Цвет фона шапки» — выберите цвет шапки;
• «Цвет текста шапки» — выберите цвет текста шапки;
• «Размер шрифта шапки» — выберите размер шрифта шапки;
• «Высота шапки» — установите значение высоты шапки таблицы;
• «Перенос строк в шапке» — если включить переключатель, то в шапке таблицы текст будет перенесен;
• «Выравнивание в шапке» — на выбор три варианта выравнивания шапки: по левому краю, по центру, по правому краю.

Раздел «Условное форматирование»

В сводной таблицы можно настраивать условное форматирование в разделе «Условное форматирование». Раздел содержит правила, которые применяются для форматирования таблицы.

Для добавления нового правила необходимо нажать на кнопку «Создать».

Отобразятся поля для заполнения:

• «Название» — заполните наименование правила;
• «Что оформляем» – поле, ячейки, которые необходимо оформить;
• «Что проверяем» – поля, знания которых будут проверены на соответствие условиям. Значение «Что проверяем» рассчитается для каждого значения офорляемой ячейки, и может быть выбрано только из полки значений, обязательно должно иметь в при вычислении агрегатную функцию. Значение может быть скрыто для отображения, если ему установить свойство «Скрыть результат»;
  
• «Условие 1» и «Условие 2» – условие или диапазон значений, которым должно удовлетворять значение «Что проверяем» для того, чтобы условное форматирование отработало. Каждому условию должен быть задан оператор сравнения;
• «Логика» — установите переключатель на положении «И» или «ИЛИ»;
• «Значения» или «Итоги» — установите галочки в поля. Данные поля указывают, поля какого уровня будут оформлены;
• «Оформление»:
  • «Цвет текста» — выберите цвет текста;
  • «Цвет фона» — выберите цвет фона для условного форматирования;
  • «Начертание» — установите галочку в необходимом начертании:
    • «В» — полужирный;
    • «I» — курсив;
    • «U» — подчеркнутый.
  • «Вся строка» — при включении данного переключателя будет форматироваться вся строка, подходящая под условие.
• «Индикатор» — выберите из выпадающего списка один из индикаторов. Индикаторы всегда отображаются слева от значения ячейки;
  
• «Цвет индикатора» — выберите цвет индикатора.

При необходимости удаления настроенного условного форматирования нажмите на кнопку «Удалить». Если необходимо создать еще одно условное форматирование для таблицы, то нажмите на кнопку «Создать».

Раздел «Многоуровневая шапка»

В данном разделе возможно настроить многоуровневую шапку таблицы. Для этого включите переключатель «Заголовок значений» и нажмите на кнопку «+Добавить заголовок».

При необходимости многоуровневой шапки для полей с полки Детализация включите переключатель «Заголовок детализации строк». Его настройка аналогична настройке заголовка значений.

Введите наименование заголовка в поле «Новый заголовок» просто нажатием на строку. При необходимости удаления заголовка нажмите на иконку крестика.

В зависимости от количества полей в полке Значения в разделе «Многоуровневая шапка» будет отображаться определенное количество полей (выделяются от заголовков цветом фона, он серый).

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

Стрелки отображаются при наведении курсора на поле заголовка.

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

При необходимости настройки многоуровневой шапки для полей полки Детализация включите переключатель «Заголовки детализации строк» и настройте по аналогии со значениями.

Дополнительно

Скролл

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

Вычисления для разных уровней иерархии строк

Добавлена возможность использования переменной !ROW_LEVEL! в вычисляемых выражениях. Эта переменная подставляет алиас поля, соответствующего текущему уровню разворачивания. Уровни определяются следующим образом: первое поле на полке «Строки» соответствует первому уровню, второе поле — второму уровню и так далее. Алиас поля — это его имя, отображаемое в панели выбора полей слева; настройки заголовка (тайтла) поля на алиас не влияют. Для корректного сравнения переменной с алиасом поля необходимо заключить алиас сначала в двойные кавычки, а затем в одинарные.

Строка общих итогов считается нулевым уровнем разворачивания, и для неё переменная !ROW_LEVEL! принимает специальное значение 'ROW_LEVEL.Total'. Если на полке детализации присутствуют поля, им соответствует единый уровень разворачивания, на котором переменная !ROW_LEVEL! принимает значение 'ROW_LEVEL.Details'.

Пример вычисляемого поля:

CASE
WHEN !ROW_LEVEL! = '"fed_okrug_short_name"' THEN SUM("summa_rub")
WHEN !ROW_LEVEL! = '"region"' THEN SUM("price_rub")
WHEN !ROW_LEVEL! = 'ROW_LEVEL.Total' THEN  SUM("amount")
WHEN !ROW_LEVEL! = 'ROW_LEVEL.Details' THEN MAX("amount")
ELSE MIN("amount") END

Стилизация элементов сводной таблицы через пользовательский CSS

Сводная таблица поддерживает кастомизацию внешнего вида через CSS-классы, встроенные в ее структуру.

Процесс настройки:

• Перейдите в режим редактирования отчета.

• Откройте поле «Пользовательский CSS» при помощи кнопки «CSS».

• Добавьте CSS-правила с соответствующими селекторами для нужных элементов.

Особенности реализации:

• Каждый элемент таблицы имеет уникальные классы для стилизации.
• CSS-код применяется динамически после загрузки данных.
• Поддерживаются все стандартные CSS-свойства.

 

Настройка цветов кнопки поиска

При помощи класса pivot-search-button можно настроить цвет фона (background) и основной цвет (color)

.pivot-search-button {
 color: lightgray !important;
 background: gray !important;
}

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

.pivot-search-button.selected {
  color: black !important;
}

 

Настройка альтернативного вида кнопки сортировки

При помощи селектора pivot-measure-sort-button-default можно отключить  вид кнопки сортировки по умолчанию.

.pivot-measure-sort-button-default {
 display: none !important;
}

При помощи класса pivot-measure-sort-button можно включить альтернативный вид кнопки сортировки и настроить для него цвет фона (background) и основной цвет (color).

.pivot-measure-sort-button {
 display: block !important;
}

 

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

При помощи селектора pivot-header-ver-expander-default можно отключить дефолтный вид кнопки разворачивания.

.pivot-header-ver-expander-default {
 display: none !important;
}

При помощи класса pivot-header-ver-expander-sq можно включить альтернативный вид кнопки разворачивания и настроить для него цвет фона (background) и основной цвет (color).

.pivot-header-ver-expander-sq {
 display: block !important;
}

 

При помощи класса expander-sq-border можно настроить цвет фона и радиус скругления альтернативного вида кнопки разворачивания.

.expander-sq-border {
 background-color: gray !important;
 border-radius: 3px;
}

 

При помощи класса expander-sq-triangle можно настроить цвет стрелки альтернативного вида кнопки разворачивания.

.expander-sq-triangle {
 fill: lightgray;
}

 

Отключение отступа уровней в вертикальном заголовке

При помощи класса pivot-header-ver-offset можно отключить отступы пропорциональные уровню разворачивания.
 

.pivot-header-ver-offset {
 display: none !important;
}

 

Включение подчеркивания текста в вертикальном заголовке

При помощи класса pivot-header-ver-content можно добавить подчеркивание текста в строках где возможно разворачивание.
 

.pivot-header-ver-content.expandable {
 text-decoration: underline;
 cursor: pointer;
}

 

Отображение кнопки аккордеона

Кнопка аккордеона будет отображаться справа и будет оформлена в соответствии с дизайн-макетом:

.pivot-header-ver-expander-sq {
 display: block !important;
}
.pivot-header-ver-expander-default {
 display: none !important;
}
.expander-sq-border {
 background-color: gray !important;
 border-radius: 3px;
}
.expander-sq-triangle {
 fill: lightgray;
}

 

Подчеркивание значений аккордеона

Значения Группировки строк будут иметь подчеркивание, если их можно раскрыть при помощи аккордеона.

.pivot-header-ver-content.expandable {
 text-decoration: underline;
 cursor: pointer;
}

 

Значок сортировки

Значок сортировки будет отображаться в соответствии с дизайн-макетом:

.pivot-measure-sort-button-default {
 display: none !important;
}
.pivot-measure-sort-button {
 display: block !important;
}

 

Выпадающий список для функции «Поиск»

Выпадающий список для функции «Поиск» будет оформлен в соответствии с дизайн-макетом, когда для соответствующего фильтра (Локального или Общего) в настройках Сводной таблицы указан Тип фильтра «По значению».

.pivot-search-button {
 color: lightgray !important;
 background: gray !important;
}
.pivot-search-button.selected {
  color: black !important;
}

 

Наименование шрифта

В Сводную таблицу в разделе «Стилизация» для опции «Наименование шрифта» можно добавить новый шрифт.

/* импорт шрифта Oswald */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap');
span,p,h1,h2,h3,a,tspan,div {
  font-family: 'Oswald', sans-serif;
}