Trend#

Визуализацию трендов следует использовать для наборов данных, содержащих последовательное числовое поле x, которое не является временным. В качестве примеров можно привести графики функций, кривые оборотов/крутящего момента, соотношения спроса и предложения, а также графики высот или частоты сердечных сокращений на трассе забега (где x - это расстояние или длительность от старта).

Например, вы могли бы представить зависимость мощности и крутящего момента двигателя от скорости, где скорость отображается по оси x, а мощность и крутящий момент - по оси y:

Визуализация трендов поддерживает все визуальные стили и опции, доступные в визуализации временных рядов, за следующими исключениями:

• Нет аннотаций или временных областей

• Нет общего курсора / перекрестия

• Нет оси x с несколькими часовыми поясами

• Нет возможности изменять временной диапазон на панели мониторинга с помощью перетаскивания

Предусловия#

• Пользователь авторизован и имеет права на редактирование дашборда.

• В источнике данных доступны числовые поля, одно из которых используется как ось X (не временная метка).

• Данные содержат последовательные числовые значения, подходящие для анализа зависимости (например, скорость, расстояние, нагрузка).

• Визуализация «Trend» доступна в списке типов панелей в интерфейсе GRAF.

Правила эксплуатации#

• Используйте Trend для отображения зависимостей между числовыми величинами — не подходит для временных данных (используйте Time series).

• Применяйте X axis options — для выбора корректного числового поля (например, скорость, расстояние, нагрузка).

• Используйте Logarithmic или Symlog шкалу — при большом разбросе значений на оси Y.

• Включайте Stack series — только при необходимости показать суммарную зависимость.

• Настройте Soft min/max — для стабильного отображения графика без резких скачков оси.

• Применяйте Field overrides — для индивидуальной настройки стилей отдельных рядов.

• Используйте Value mappings и Thresholds — для цветовой индикации критических значений.

• Включайте Gradient mode — для визуального выделения уровней значений под графиком.

• Ограничивайте количество рядов — чтобы не перегружать график и не затруднять анализ.

• Проверяйте отображение на разных экранах — чтобы легенда и оси оставались читаемыми.

Последовательность выполнения#

1. Убедитесь, что плагин визуализации «Trend» установлен в продукте PVV.

2. Откройте дашборд визуализации в интерфейсе PVV.

3. Выберите тип визуализации «Trend».

4. Настройте параметры конфигурации

   

5. Нажмите кнопку «Save Dashboard», чтобы отобразить визуализацию панели.

Параметры конфигурации#

В следующем разделе описываются параметры конфигурации, доступные в панели редактора панелей для этой визуализации. Эти параметры, насколько это возможно, упорядочены так, как они отображаются в Grafana.

Panel options#

X axis options#

В поле «Поле X» выберите поле, содержащее возрастающие числовые значения.

Tooltip options#

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

Tooltip mode#

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

Single - Всплывающая подсказка при наведении курсора показывает только один ряд, на который вы наводите курсор в визуализации. All - Всплывающая подсказка при наведении курсора мыши отображает все серии в визуализации. Grafana выделяет серию, на которую вы наводите курсор, жирным шрифтом в списке серий во всплывающей подсказке. Hidden - не отображает всплывающую подсказку при работе с визуализацией.

Values sort order#

Если вы установите для режима подсказки значение «All», отобразится параметр «Порядок сортировки значений». Этот параметр определяет порядок, в котором значения отображаются во всплывающей подсказке. Выберите один из следующих вариантов:

• None - Grafana автоматически сортирует значения, отображаемые во всплывающей подсказке.

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

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

Hover proximity#

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

Legend options#

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

Graph styles options#

Параметры в разделе Стили графика позволяют вам управлять общим внешним видом графика, за исключением цвета.

Axis options#

Параметры в разделе Axis определяют способ отображения осей x и y. Некоторые параметры не вступают в силу, пока вы не нажмете кнопку за пределами редактируемого поля. Можно нажать Enter.

Placement#

Выберите расположение оси y. Выберите одно из следующих значений:

• Auto - Автоматическое назначение оси y ряду. Если имеется два или более ряда с разными единицами измерения, Grafana назначает левую ось первой единице измерения, а правую - последующим единицам измерения.

• Left - Отобразить все оси y с левой стороны.

• Right - Отобразить все оси y с правой стороны.

• Hidden - Скрыть все оси. Чтобы выборочно скрыть оси, добавьте переопределение поля, предназначенное для определенных полей.

Scale#

Установите шкалу значений по оси y. Выберите один из вариантов:

• Linear - делит шкалу на равные части.

• Logarithmic - используйте логарифмическую шкалу. Если вы выберете этот параметр, в списке «База журнала» выберите двоичную (с основанием 2) или обычную (с основанием 10) логарифмическую шкалу.

• Symlog - используйте симметричную логарифмическую шкалу. Если вы выберете этот параметр, выберите также:

  • Log base - выберите двоичную (с основанием 2) или обычную (с основанием 10) логарифмическую шкалу.

  • Linear threshold - установите порог, при котором шкала изменяется с линейной на логарифмическую.

Soft min and soft max#

Установите параметр Soft min или soft max, чтобы лучше контролировать пределы оси y. По умолчанию Grafana автоматически устанавливает диапазон для оси y на основе набора данных.

Настройки Soft min и soft max могут предотвратить увеличение небольших изменений в данных, когда они в основном плоские. Напротив, жесткие значения min и max помогают избежать искажения полезных деталей в данных, отсекая периодические всплески после определенной точки.

Чтобы задать жесткие ограничения для оси y, задайте стандартные параметры min/max. Дополнительные сведения смотри в разделе Настройка стандартных параметров. В следующих примерах показано, как этот параметр работает при визуализации временных рядов:

Standard options#

Стандартные параметры в панели редактора панелей позволяют изменять способ отображения данных полей в визуализациях. При установке стандартного параметра изменение применяется ко всем полям или рядам. Для более детального управления отображением полей обратитесь к разделу Настройка переопределений.

Data links and actions#

Ссылки на данные позволяют создавать ссылки на другие панели, сводные панели и внешние ресурсы, сохраняя при этом контекст исходной панели. Можно создавать ссылки, содержащие название серии или даже значение под курсором. Дополнительные сведения смотри в разделе Настройка ссылок на данные и действий.

Для каждого канала передачи данных установите следующие параметры:

• Title

• URL

• Open in new tab

Ссылки на данные для этой визуализации не включают переключатель One click, однако, если настроен только один канал передачи данных, этот канал передачи данных имеет функцию One click. Если настроено несколько каналов передачи данных, то при нажатии на визуализацию открывается меню, в котором отображаются все каналы передачи данных.

Value mappings#

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

Для каждого отображения значений задайте следующие параметры:

• Condition - выберите, что будет отображаться в отображаемом тексте и (необязательно) цвете:

  • Value - Конкретные значения

  • Range - Числовые диапазоны

  • Regex - Регулярные выражения

  • Special - специальные значения, такие как Null, NaN (не число), или логические значения, такие как true и false

• Display text - Отображаемый текст

• Color - Цвет (необязательно)

• Icon- Значок (только на холсте)

Дополнительные сведения смотри в разделе Настройка сопоставления значений.

Thresholds#

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

Для каждого порогового значения задайте следующие параметры:

Чтобы узнать больше, обратитесь к разделу Настройка пороговых значений.

Field overrides#

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

Выберите один из следующих вариантов переопределения:

Дополнительные сведения смотри в разделе Настройка переопределений полей.

Результат#

После настройки и сохранения панели с визуализацией Trend выполните следующие шаги для проверки корректности ее работы:

1. Проверка отображения данных на графике
   Убедитесь, что:

   • Все ряды данных отображаются корректно.

   • Ось X использует выбранное числовое поле (например, скорость, расстояние, частота) и отображает значения в порядке возрастания.

   • Ось Y отображает соответствующие значения (например, мощность, крутящий момент) с правильной шкалой и единицами измерения.

   • При наличии нескольких рядов — они различаются по цвету и стилю линий.

2. Проверка стиля графика (Graph styles options)

   • Убедитесь, что:

     • Выбранный Style (линии, столбцы, точки) отображается корректно.

     • Line interpolation правильно соединяет точки (линейная, ступенчатая, сглаженная).

     • Line width и Fill opacity соответствуют заданным значениям.

     • При включенном Gradient mode — заливка под графиком отображается с градиентом.

     • Line style (сплошная, пунктирная, штриховая) применяется корректно.

     • При включенном Connect null values — пропущенные значения соединяются линией.

     • При включенном Disconnect values — при превышении порога линия разрывается.

     • Show points отображает точки данных, если включено.

     • Point size соответствует заданному диаметру.

     • При включенном Stack series — ряды отображаются друг над другом (суммируются).

     • Bar alignment и Bar width factor корректно влияют на положение и ширину столбцов.

3. Проверка осей (Axis options)

   • Убедитесь, что:

     • Ось Y отображается слева, справа или скрыта в соответствии с настройкой Placement.

     • При наличии нескольких рядов с разными единицами измерения — Auto корректно распределяет оси.

     • Подпись оси (Label) отображается и соответствует выбранной единице измерения.

     • Сетка отображается при включенном Show grid lines.

     • Шкала оси Y соответствует выбранному типу: Linear, Logarithmic или Symlog.

     • При выборе Logarithmic или Symlog — указана корректная Log base (2 или 10).

     • При использовании Symlog — задан Linear threshold, и переход от линейной к логарифмической шкале происходит корректно.

     • При включенном Centered zero — ноль находится по центру оси.

     • Пределы оси соответствуют настройкам Soft min и Soft max (плавное масштабирование).

     • Жесткие ограничения (если заданы в Standard options > Min/Max) применяются и не позволяют выходить за указанные границы.

4. Проверка всплывающих подсказок (Tooltip)

   • Убедитесь, что:

     • При наведении на график отображается всплывающая подсказка.

     • В режиме Single — показывается информация только по текущему ряду.

     • В режиме All — отображаются все ряды, а активный выделен жирным.

     • При выборе Hide zeros — ряды со значением 0 не отображаются в подсказке.

     • Порядок значений во всплывающей подсказке соответствует выбранному Values sort order (по возрастанию, убыванию или автоматически).

     • Расстояние Hover proximity корректно определяет чувствительность наведения.

     • Максимальная ширина и высота подсказки соблюдаются.

5. Проверка легенды (Legend)

   • Убедитесь, что:

     • Легенда отображается при включенной Visibility.

     • Режим отображения (List или Table) соответствует выбранному.

     • Расположение (Placement) — Bottom или Right — отображается корректно.

     • При размещении справа — ширина легенды соответствует настройке Width.

     • В легенде отображаются выбранные значения: Min, Max, Avg, Total и др.

     • Цвета и стили в легенде соответствуют рядам на графике.

6. Проверка единиц измерения и форматирования

   • Убедитесь, что:

     • Единицы измерения (Unit) применяются ко всем значениям (в осях, легенде, подсказках).

     • Количество знаков после запятой (Decimals) отображается корректно.

     • Пустые или null значения заменяются текстом из No value (по умолчанию — -).

     • Отображаемые имена полей (Display name) соответствуют настройкам, включая использование переменных.

7. Проверка цветовой схемы и стилизации

   • Убедитесь, что:

     • Цвета рядов соответствуют выбранной Color scheme.

     • При использовании Value mappings — определенные значения отображаются с заданным цветом и текстом.

     • Переопределения (Field overrides) применяются к нужным полям (например, изменение цвета, ширины линии, стиля).

8. Проверка порогов (Thresholds)

   • Убедитесь, что:

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

     • Цвета порогов соответствуют настройкам.

     • Режим Absolute или Percentage применяется корректно.

9. Проверка интерактивности и ссылок

   • Убедитесь, что:

     • При клике на ряд или легенду:

       • Если настроена одна Data link — происходит переход по ссылке (один клик).

       • Если несколько — открывается меню выбора.

     • Контекст (переменные дашборда) передается при переходе.

     • Заголовки и URL ссылок отображаются корректно.

10. Проверка производительности и адаптивности

    • Убедитесь, что:

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

      • При изменении размера панели — график и элементы масштабируются корректно.

      • На малых экранах — легенда, оси и метки остаются читаемыми.

11. Проверка отображения в разных режимах

    • Убедитесь, что:

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

      • Все настройки сохраняются после перезагрузки дашборда.

      • При открытии в полноэкранном режиме — элементы не накладываются друг на друга.

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