Кастомные дашборды

Руководство по созданию и настройке кастомных дашбордов: типы виджетов, источники данных (OLAP Мастер, PromQL, LogsQL, OLAP экспертный, Базовый режим), типы визуализации.

На этой странице:

Введение

Кастомные дашборды — раздел платформы Proto Observability для создания персонализированных визуализаций на основе метрик, логов и других данных. Дашборды позволяют собирать на одном экране виджеты с графиками, таблицами, карточками и текстом для мониторинга ключевых показателей.

Как открыть: перейдите в раздел Дашборды в основном меню навигации платформы.


Создание дашборда

  1. Перейдите в раздел Дашборды в меню навигации
  2. Нажмите кнопку + Дашборд
  3. В открывшемся окне введите название дашборда и нажмите Создать
  4. Откроется конструктор дашбордов с пустой рабочей областью

После создания дашборда добавьте виджеты и настройте их, затем нажмите Сохранить в правом верхнем углу.

Для отмены создания нажмите кнопку с красным крестиком рядом с кнопкой Сохранить.


Типы виджетов

При добавлении виджета выберите один из типов из выпадающего меню Виджет:

ТипОписание
ТекстВиджет с произвольным текстом и форматированием. Поддерживает ссылки и базовое редактирование. Для редактирования нажмите иконку с тремя точками и выберите Изменить.
ГрафикВиджет с визуализацией данных. Поддерживает несколько источников данных и типов визуализации. Настройка через иконку с тремя точками > Изменить.

Виджеты можно перемещать и изменять их размер на рабочей области дашборда. На дашборде может быть размещено произвольное количество виджетов обоих типов.


Источники данных для виджетов-графиков

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

OLAP Мастер (APM и EUM метрики)

Источник данных OLAP Мастер — управляемый (wizard) режим для построения графиков по APM и EUM метрикам через OLAP-движок.

Возможности:

  • Выбор метрик из курируемого каталога
  • Выбор сервиса и эндпоинта (операции)
  • Автоматическое построение OLAP-запроса на основе выбранных параметров
  • Курируемый набор визуализаций, оптимизированных для APM-данных

Этот режим подходит для быстрого построения визуализаций по стандартным метрикам APM и EUM без написания запросов.

PromQL (Инфраструктурные метрики)

Источник данных PromQL позволяет писать произвольные PromQL-запросы для визуализации метрик Prometheus.

Возможности:

  • Текстовое поле для ввода PromQL-запроса
  • Добавление до 5 запросов на один виджет через кнопку + Запрос — результаты всех запросов отображаются на одном графике
  • Поддержка всех функций и операторов PromQL

Пример запроса:

round(avg(system_cpu_system{host=~".*central1.internal"}) by (host), 0.1)

Подробнее о синтаксисе PromQL см. Браузер метрик и построитель PromQL-запросов.

LogsQL (Аналитика логов)

Источник данных LogsQL позволяет визуализировать данные логов с помощью запросов LogsQL. Этот источник данных поддерживает два режима работы:

Режим Hits (попадания)

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

Режим Stats (статистика)

Визуализация результатов агрегатных запросов LogsQL с использованием пайпа stats. Подходит для отображения вычисленных показателей (количество, среднее, максимум и другие агрегации).

Пример запроса LogsQL для режима Hits:

service:exact("payment-service") AND level:exact("error")

Подробнее о синтаксисе LogsQL см. Logs Explorer.

OLAP экспертный режим

Источник данных OLAP экспертный режим предоставляет полный доступ к OLAP-движку с расширенным набором визуализаций.

Возможности:

  • Произвольные OLAP-запросы (measures, dimensions, filters, timeDimensions)
  • Расширенный набор визуализаций, включая специализированные типы: поток бизнес-процесса (BusinessFlow), геокарта (GeoMap), граф связей (DirectedGraph), горизонтальная столбчатая диаграмма (StackHorizontalBar), составная карточка (CardStacked)
  • Полный контроль над параметрами запроса и отображения

Этот режим подходит для опытных пользователей, которым нужны расширенные визуализации и полный контроль над OLAP-запросами.

Базовый режим (устаревший)

Источник данных Базовый режим использует GraphQL API для выбора метрик.

Возможности:

  • Выбор метрик через GraphQL API платформы
  • Поддержка специфичных визуализаций: список топ значений (TopList), текст (Text), тепловая карта (Heatmap), список сервисов (ServiceList), список эндпоинтов (EndpointList), список инстансов (InstanceList)

Типы визуализации

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

Визуализации для OLAP Мастер

Тип визуализацииОписание
Столбчатая диаграмма (Bar)Вертикальные столбцы для сравнения значений
Линейная диаграмма (Line)Линия, показывающая изменение значения во времени
Линейная диаграмма с областями (Area)Линия с заполненной областью под ней
Круговая диаграмма (Pie)Круговая визуализация долей
Карточка (Card)Одно числовое значение крупным шрифтом
Таблица (Table)Табличное представление данных
Воронка (Funnel)Визуализация последовательных этапов процесса с уменьшением значений
Спидометр (Gauge)Круговой индикатор значения
Карта Здоровья (Treemap)Иерархическая древовидная карта для визуализации состояния компонентов
Линейная диаграмма с baseline (Line_baseline)Линейный график с линией базового уровня

Визуализации для PromQL

Тип визуализацииОписание
Столбчатая диаграмма (Bar)Вертикальные столбцы
Линейная диаграмма (Line)Линейный график
Линейная диаграмма с областями (Area)Линия с заполненной областью
Круговая диаграмма (Pie)Круговая визуализация
Карточка (Card)Одно числовое значение
Таблица (Table)Табличное представление
Спидометр (Gauge)Круговой индикатор
Карта Здоровья (Treemap)Иерархическая древовидная карта для визуализации состояния компонентов
Линейная диаграмма с baseline (Line_baseline)Линейный график с базовой линией

Визуализации для LogsQL

Доступные визуализации зависят от режима LogsQL:

Режим Hits (попадания):

Тип визуализацииОписание
Столбчатая диаграмма (Bar)Объем логов по временным интервалам
Линейная диаграмма (Line)Динамика количества логов
Линейная диаграмма с областями (Area)Динамика с заполненной областью

Режим Stats (статистика):

Тип визуализацииОписание
Столбчатая диаграмма (Bar)Результаты агрегации в виде столбцов
Линейная диаграмма (Line)Результаты агрегации в виде линии
Линейная диаграмма с областями (Area)Результаты агрегации с областью
Круговая диаграмма (Pie)Результаты агрегации в виде долей

Визуализации для OLAP экспертного режима

Тип визуализацииОписание
Столбчатая диаграмма (Bar)Вертикальные столбцы для сравнения значений
Линейная диаграмма (Line)Линейный график
Линейная диаграмма с baseline (Line_baseline)Линейный график с линией базового уровня
Линейная диаграмма с областями (Area)Линия с заполненной областью
Карточка (Card)Одно числовое значение крупным шрифтом
Таблица (Table)Табличное представление данных
Круговая диаграмма (Pie)Круговая визуализация долей
Воронка (Funnel)Визуализация последовательных этапов процесса
Поток бизнес-процесса (BusinessFlow)Визуализация потока бизнес-процесса с этапами и переходами
Спидометр (Gauge)Круговой индикатор значения
Геокарта (GeoMap)Географическая карта с данными по регионам
Граф связей (DirectedGraph)Ориентированный граф для визуализации связей между компонентами
Столбчатая диаграмма горизонтальная стековая (StackHorizontalBar)Горизонтальные столбцы с группировкой
Карточка составная (CardStacked)Карточка с несколькими значениями
Карта Здоровья (Treemap)Иерархическая древовидная карта для визуализации состояния компонентов

Визуализации для Базового режима (устаревший)

Тип визуализацииОписание
Столбчатая диаграмма (Bar)Вертикальные столбцы для сравнения значений
Линейная диаграмма (Line)Линия, показывающая изменение значения во времени
Линейная диаграмма с областями (Area)Линия с заполненной областью под ней
Круговая диаграмма (Pie)Круговая визуализация долей
Карточка (Card)Одно числовое значение крупным шрифтом
Список топ значений (TopList)Ранжированный список значений
Таблица (Table)Табличное представление данных
Текст (Text)Текстовое значение
Тепловая карта (Heatmap)Цветовая матрица интенсивности значений
Список Сервисов (ServiceList)Список сервисов с метриками
Список Эндпоинтов (EndpointList)Список эндпоинтов с метриками
Список Инстансов (InstanceList)Список инстансов с метриками
Линейная диаграмма с baseline (Line_baseline)Линейный график с линией базового уровня
Спидометр (Gauge)Круговой индикатор значения

Вкладки дашборда

Дашборд может содержать несколько вкладок для организации виджетов по категориям.

Управление вкладками:

  • Переименование — нажмите иконку с тремя точками рядом с названием вкладки и выберите Переименовать вкладку
  • Добавление — нажмите иконку + рядом с последней вкладкой
  • Удаление — нажмите иконку x над названием вкладки

По умолчанию при создании дашборда доступна одна вкладка — «Вкладка 1».


Переменные дашборда (фильтры)

Переменные дашборда — это фильтры, которые отображаются в виде выпадающих списков в шапке дашборда и применяются сразу ко всем виджетам. Например, переменная host позволяет на одном дашборде переключаться между серверами вместо создания отдельного дашборда для каждого. Это знакомый по Grafana механизм template variables.

Переменные работают с виджетами на источнике данных PromQL.

Как открыть управление переменными

  1. Откройте дашборд на редактирование (иконка «ручка»)
  2. Нажмите кнопку Переменные на панели инструментов
  3. Откроется окно со списком переменных дашборда

Список переменных дашборда

В списке отображается имя переменной ($имя), её тип и определение. Для каждой переменной доступны действия: изменить, дублировать, удалить. Кнопка Добавить переменную создаёт новую.

Добавление и настройка переменной

При добавлении или изменении переменной заполните поля формы:

Настройка переменной

ПолеНазначение
ИмяИмя переменной. В запросах виджетов на неё ссылаются как $имя (например, $host). Допускаются латинские буквы, цифры и _.
ПодписьНеобязательный заголовок переменной в строке фильтров. По умолчанию — имя.
ТипQuery — значения берутся из метрик автоматически. Custom — список значений задаётся вручную.
МетрикаТолько для типа Query, необязательно. Ограничивает список значений одной метрикой. Если поле пустое — значения собираются по всем метрикам.
LabelТолько для типа Query. Имя метки, значения которой попадут в выпадающий список (например, host, instance).
Значения через запятуюТолько для типа Custom. Список значений выпадающего списка.
МультивыборРазрешить выбор нескольких значений одновременно.
Опция «Все»Добавить в список пункт «Все», который снимает фильтр по переменной.
Значение для «Все»Что подставляется при выборе «Все». По умолчанию .* (любое значение).
Фильтровать виджеты по labelМетка, по которой переменная фильтрует виджеты (см. ниже). Обычно совпадает с полем Label.
Предпросмотр значенийПоказывает первые значения, которые получит фильтр, — для проверки настройки.

После настройки нажмите Применить в форме, затем Применить в окне списка и Сохраните дашборд.

Как переменная применяется к виджетам

Есть два способа связать переменную с виджетами; можно использовать любой из них или оба сразу.

Способ 1 — автоматически по метке (рекомендуется). Заполните поле Фильтровать виджеты по label (обычно совпадает с Label, например host). Тогда ко всем PromQL-виджетам дашборда автоматически добавляется фильтр по выбранным значениям этой метки — запросы виджетов менять не нужно. Это основной сценарий: «один дашборд, фильтруемый по хосту».

Способ 2 — явно в запросе. Сошлитесь на переменную прямо в PromQL-запросе виджета через $имя. Используйте оператор =~, так как при мультивыборе подставляется регулярное выражение:

system_cpu_system{host=~"$host"}

При выборе «Все» (или пустом выборе) фильтр снимается — отображаются данные по всем значениям.

Использование фильтров

В режиме просмотра дашборда выпадающие списки переменных отображаются в шапке, рядом с подписью Фильтр. Выберите одно или несколько значений — графики обновятся автоматически.

Выбор значений переменной

Текущий выбор сохраняется в адресной строке (URL), поэтому ссылкой на дашборд можно поделиться вместе с выбранными значениями фильтров — кнопка Поделиться учитывает их автоматически. Значения по умолчанию сохраняются в дашборде при его сохранении.


Операции с дашбордами

ОперацияОписание
Просмотр спискаРаздел Дашборды отображает список всех кастомных дашбордов
ОткрытиеНажмите на название дашборда в списке
РедактированиеНажмите иконку «ручка» в столбце Операции
ПереименованиеНажмите иконку «страница» в столбце Опции
УдалениеНажмите иконку красного крестика в столбце Опции
ПоискТекстовое поле для поиска дашбордов по названию
ЭкспортСохранение дашборда в файл для передачи
ИмпортЗагрузка дашборда из файла

Примеры

Пример 1: дашборд с PromQL-виджетами для мониторинга CPU

  1. Создайте новый дашборд
  2. Добавьте виджет типа График
  3. В настройках виджета выберите источник данных PromQL (Инфраструктурные метрики)
  4. Выберите тип визуализации Линейная диаграмма
  5. Введите запрос:
round(avg(system_cpu_system{host=~".*central1.internal"}) by (host), 0.1)
  1. Задайте название виджета, например, «CPU по хостам»
  2. Сохраните дашборд

Пример 2: виджет через OLAP Мастер для отслеживания времени отклика сервиса

  1. Создайте новый дашборд или откройте существующий на редактирование
  2. Добавьте виджет типа График
  3. В настройках виджета выберите источник данных OLAP Мастер (APM и EUM метрики)
  4. Выберите метрику, например, «Время отклика (P95)»
  5. Выберите сервис из выпадающего списка
  6. Выберите тип визуализации Линейная диаграмма
  7. Задайте название виджета, например, «P95 время отклика — payment-service»
  8. Сохраните дашборд