+++
title = "Node graph panel"
keywords = ["harvest", "dashboard", "documentation", "panels", "node graph", "directed graph"]
weight = 850
+++

# Панель графа узлов

> ** Примечание: ** В настоящее время эта панель находится в стадии бета-тестирования. Ожидайте изменений в будущих выпусках.

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

![Панель графа узлов](/static/img/docs/node-graph/node-graph-7-4.png "График узлов")

## Требования к данным

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

Визуализация графа узлов состоит из _nodes_ и _edges_.

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

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

### Узлы

> ** Примечание: ** На данный момент график узлов может отображать только 1500 узлов. Если этот предел будет превышен, в правом верхнем углу появится предупреждение.

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

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

![Навигация по графу узлов](/static/img/docs/node-graph/node-graph-navigation-7-4.gif "Навигация по графу узлов")

### Края

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

Первым источником данных, поддерживающим эту визуализацию, является источник рентгеновских данных для функции служебной карты it. Для получения дополнительной информации обратитесь к [Документации по плагину X-Ray](https://harvest.com/harvest/plugins/harvest-x-ray-datasource ).

## Навигация по графу узлов

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

### Сковорода

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

### Увеличение или уменьшение масштаба

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

## API данных

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

Источник данных должен возвращать два фрейма данных, один для узлов и один для ребер, и вы также должны установить `frame.meta.preferredVisualisationType = 'NodeGraph" для обоих фреймов данных.

### Параметры узла

Обязательные поля:

| Имя поля | Тип | Описание |
|------------|---------|-------------|
| id | строка | Уникальный идентификатор узла. На этот идентификатор ссылается edge в поле source и target. |

Необязательные поля:

| Имя поля | Тип | Описание |
|------------|---------|-------------|
| title | строка | Имя узла, видимого непосредственно под узлом. |
| subTitle | строка | Дополнительный, имя, тип или другой идентификатор, который будет показан прямо под заголовком. |
| mainStat | строка/число | Первая статистика, показанная внутри самого узла. Может быть либо строкой, и в этом случае значение будет показано как есть, либо это может быть число, и в этом случае также будет показана любая единица измерения, связанная с этим полем. |
| secondaryStat | string /number | Такой же, как Mainstat, но показан прямо под ним внутри узла. |
| arc__* | number | Любое поле с префиксом `arc__` будет использоваться для создания цветового круга вокруг узла. Все значения в этих полях должны быть равны 1. Вы можете указать цвет с помощью `config.color.fixedColor`. |
| detail__* | строка/число | Любое поле с префиксом "detail__" будет отображаться в заголовке контекстного меню при нажатии на узел. Используйте `config.DisplayName` для более удобочитаемой метки. |

### Параметры края

Обязательные поля:

| Имя поля | Тип | Описание |
|------------|---------|-------------|
| id | строка | Уникальный идентификатор ребра. |
| source | строка | Идентификатор исходного узла. |
| target | строка | Идентификатор цели. |

Необязательные поля:

| Имя поля | Тип | Описание |
|------------|---------|-------------|
| mainStat | строка /число | Первая статистика, отображаемая в наложении при наведении курсора на край. Может быть либо строкой, и в этом случае значение будет показано как есть, либо это может быть число, и в этом случае также будет показана любая единица измерения, связанная с этим полем |
| secondaryStat | string /number | Такой же, как Mainstat, но показан прямо под ним. |
| detail__* | строка/число | Любое поле с префиксом "detail__" будет отображаться в заголовке контекстного меню при нажатии на край. Используйте `config.DisplayName` для более удобочитаемой метки. |