Перейти к основному содержимому
Версия: 6.0

Граф

Описание

Граф — это визуальное представление Модели здоровья. Далее в статье используется сокращенное название — модель. Граф показывает сервисы в виде узлов, связи между ними и текущее состояние каждого сервиса.

Страница графа состоит из трех основных областей:

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

Общий вид графа

Основные возможности

Граф позволяет:

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

Левая панель

Левая панель используется для выбора модели и навигации по сервисам текущего графа.

Левая панель графа

Основные элементы панели:

  1. Модель — выпадающий список для выбора модели. Кнопка с иконкой плюса рядом с названием поля открывает создание новой модели
  2. Корневой сервис — поле выбора сервиса, ветку которого нужно показать как основную
  3. Зависимые сервисы — поиск по сервисам, которые сейчас видны на графе
  4. Сортировка по статусу — переключатель направления сортировки списка сервисов
  5. Список сервисов — перечень сервисов выбранной модели с индикатором состояния

Выбор модели

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

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

Корневой сервис

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

Граф с выбранным корневым сервисом

Корневой сервис можно выбрать:

  • в поле Корневой сервис
  • с помощью иконки цели на узле графа
  • с помощью иконки цели в строке сервиса на левой панели
  • из таблицы связей в нижней панели сервиса

Чтобы сбросить корневой сервис, очистите поле Корневой сервис, повторно нажмите иконку цели на корневом узле или нажмите кнопку установки максимальной глубины графа.

примечание

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

Поиск и сортировка сервисов

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

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

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


Рабочая область графа

Рабочая область содержит холст графа, элементы управления глубиной, кнопки создания объектов, управление масштабом и настройки.

Узел графа

Узлы и связи

Каждый узел представляет отдельный сервис. В узле отображаются:

  • индикатор здоровья сервиса
  • название сервиса
  • кнопка выбора корневого сервиса
  • кнопки раскрытия дочерних или родительских веток (если доступно)

Связи между сервисами направлены слева направо. Цвет связи отражает состояние влияющего сервиса (дочернего).

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

Раскрытие веток

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

Кнопка + слева от узла раскрывает один уровень родительской ветки. После раскрытия на месте кнопки + также отображается кнопка -. При нажатии на - скрывается открытая часть родительской ветки.

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

Раскрытие ветки графа

Глубина графа

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

Если выбран корневой сервис, слайдер ограничивается уровнями его ветки. Это предотвращает выбор глубины, при которой корневой сервис или его дочерняя ветка не попадут в область отображения.

Кнопка Установить максимальную глубину раскрывает максимально доступную глубину текущей модели, сбрасывает выбранный сервис и корневой сервис, а затем центрирует граф.

Навигация по холсту

В нижней части холста расположены кнопки навигации:

  • + — приблизить граф
  • - — отдалить граф
  • Вписать в область просмотра — подобрать масштаб и положение так, чтобы видимые узлы помещались на экране

Граф также центрируется автоматически после первичной загрузки, смены модели, выбора корневого сервиса, изменения глубины и сброса корневого сервиса.

Создание сервисов и метрик

Кнопка Создать открывает меню создания объектов для выбранной модели.

Доступные действия:

  • создать метрику
  • создать сервис из инвентаря
  • создать сервис вручную

Если модель не выбрана, создание сервиса из графа недоступно.

Настройки графа

Кнопка с иконкой шестеренки открывает настройки графа.

Настройки графа

Доступные параметры:

  • Сколько уровней отобразить при открытии страницы — начальная глубина графа
  • Автообновление — включает или выключает периодическое обновление данных
  • Интервал — период автообновления в секундах
примечание

Настройки глубины и автообновления сохраняются в локальном хранилище браузера.


Нижняя панель сервиса

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

Нижняя панель сервиса

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

Основные элементы нижней панели:

  1. Название сервиса — ссылка на страницу просмотра сервиса
  2. Статус сервиса — итоговое состояние выбранного сервиса
  3. Описание — краткое описание сервиса, если оно задано
  4. Динамика и распределение состояний — сводка изменения состояния за последний период
  5. Связи и метрики — таблица зависимостей и связанных метрик
  6. Параметры сервиса — технические сведения о выбранном сервисе
  7. Кнопки действий — быстрый переход к анализу и исследованию выбранного сервиса

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

Действия с сервисом

В правой части нижней панели доступны действия:

  • Анализ первопричин — переход к анализу причин изменения состояния выбранного сервиса
  • Исследование — переход к исследованию сервиса со всеми его метриками
  • Сохраненные исследования - переход к списку исследований, в которых участвует текущий выбранный сервис

Связи и метрики

Блок Связи и метрики показывает зависимости выбранного сервиса и связанные с ним метрики. Для каждой строки отображается состояние, название и тип объекта связи.

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

Сброс выбранного сервиса

Выбранный сервис сбрасывается при:

  • клике по пустой области холста
  • выборе другого сервиса
  • выборе корневого сервиса
  • смене модели
  • установке максимальной глубины графа

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


Сохранение состояния

Страница графа записывает основные параметры просмотра в адресную строку. Такую ссылку можно отправить другому пользователю, чтобы открыть граф с той же моделью, выбранным сервисом и корневым сервисом.

Используемые параметры:

  • modelId — выбранная модель
  • serviceId — выбранный сервис и открытая нижняя панель
  • rootServiceId — выбранный корневой сервис

Если в ссылке переданы serviceId и rootServiceId, они применяются как независимые параметры. Выбранный сервис не становится корневым автоматически.