> ## Documentation Index
> Fetch the complete documentation index at: https://clickhouse.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Панели мониторинга

> Функция панелей мониторинга в SQL Console позволяет собирать визуализации из сохранённых запросов и делиться ими.

export const Image = ({img, alt, size = "lg"}) => {
  const normalizedSize = ["sm", "md", "lg"].includes(size) ? size : "lg";
  return <div className={`ch-image-${normalizedSize}`}>
      <Frame>
        <img src={img} alt={alt} />
      </Frame>
    </div>;
};

export const BetaBadge = ({link, galaxyTrack, galaxyEvent}) => {
  if (link) {
    return <a href={link} target="_blank" rel="noopener noreferrer" className="betaBadge" onClick={galaxyTrack && galaxyEvent ? galaxyOnClick(galaxyEvent) : undefined}>
                <Icon />
                <span>Бета</span>
            </a>;
  }
  return <div className="betaBadge">
            <Icon />
            <span>
                Возможность в статусе бета. 
                <u>
                    <a href="/docs/docs/beta-and-experimental-features#beta-features">
                        Подробнее.
                    </a>
                </u>
            </span>
        </div>;
};

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

<div id="core-concepts">
  ## Основные понятия
</div>

<div id="query-sharing">
  ### Общий доступ к запросам
</div>

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

<div id="interactivity">
  ### Интерактивность
</div>

Используйте [параметры запроса](/docs/ru/reference/syntax#defining-and-using-query-parameters), чтобы сделать панель мониторинга интерактивной. Например, можно добавить параметр запроса в условие `WHERE`, чтобы использовать его как фильтр.

Поле ввода параметра запроса можно включить на боковой панели фильтров **Global**, выбрав тип «filter» в настройках визуализации. Его также можно включить, связав с другим объектом (например, таблицей) на панели мониторинга. См. раздел «[настроить фильтр](/docs/ru/products/cloud/features/sql-console-features/dashboards#configure-a-filter)» в руководстве по быстрому старту ниже.

<div id="quick-start">
  ## Быстрый старт
</div>

Создадим панель мониторинга для отслеживания нашего сервиса ClickHouse с помощью системной таблицы [query\_log](/docs/ru/reference/system-tables/query_log).

<div id="quick-start">
  ## Быстрый старт
</div>

<div id="create-a-saved-query">
  ### Создайте сохранённый запрос
</div>

Если у вас уже есть сохранённые запросы для визуализации, этот шаг можно пропустить.

Откройте новую вкладку запроса. Напишем запрос, который подсчитывает объём запросов по дням для сервиса с использованием системных таблиц ClickHouse:

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/2_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=fc10079900e4048e8f30a906ee698eee" size="md" alt="Создание сохранённого запроса" border width="1600" height="1372" data-path="images/cloud/dashboards/2_dashboards.webp" />

Результаты запроса можно просмотреть в табличном формате или начать строить визуализации в режиме chart. На следующем шаге сохраним запрос под именем `queries over time`:

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/3_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=4ec75d88677d7fc4ece9b775b1c59a21" size="md" alt="Сохранение запроса" border width="1274" height="484" data-path="images/cloud/dashboards/3_dashboards.webp" />

Подробнее о сохранённых запросах см. в разделе [Saving a Query section](/docs/ru/products/cloud/features/sql-console-features/sql-console#saving-a-query).

Можно создать и сохранить ещё один запрос — `query count by query kind`, чтобы подсчитать количество запросов по их типу. Ниже показана визуализация этих данных в виде столбчатой диаграммы в SQL Console.

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/4_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=af684f04881c8ead3c371898418692b2" size="md" alt="Визуализация результатов запроса в виде столбчатой диаграммы" border width="1438" height="1600" data-path="images/cloud/dashboards/4_dashboards.webp" />

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

<div id="create-a-dashboard">
  ### Создайте панель мониторинга
</div>

Перейдите в раздел панели мониторинга и нажмите “New Dashboard”. После того как вы зададите имя, ваша первая панель мониторинга будет создана!

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/5_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=dbbf5bd88a05678c05a51e8938643a54" size="md" alt="Создать новую панель мониторинга" border width="1466" height="778" data-path="images/cloud/dashboards/5_dashboards.webp" />

<div id="add-a-visualization">
  ### Добавьте визуализацию
</div>

Есть два сохранённых запроса: `queries over time` и `query count by query kind`. Давайте визуализируем первый в виде линейного графика. Укажите для визуализации заголовок и подзаголовок, а затем выберите запрос. Затем выберите тип диаграммы «Line» и задайте оси X и Y.

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/6_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=a3b6fad8ad9247f02777bdf88defd960" size="md" alt="Добавление визуализации" border width="1600" height="1097" data-path="images/cloud/dashboards/6_dashboards.webp" />

Здесь также можно внести дополнительные стилистические изменения — например, настроить форматирование чисел, расположение легенды и подписи осей.

Затем давайте визуализируем второй запрос в виде таблицы и разместим её под линейным графиком.

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/7_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=07202a75829357a9d31f2c2cafa76476" size="md" alt="Визуализация результатов запроса в виде таблицы" border width="1600" height="1048" data-path="images/cloud/dashboards/7_dashboards.webp" />

Вы создали свою первую панель мониторинга, визуализировав два сохранённых запроса!

<div id="configure-a-filter">
  ### Настройка фильтра
</div>

Давайте сделаем эту панель мониторинга интерактивной, добавив фильтр по типу запроса, чтобы отображать только тренды, связанные с запросами Insert. Для этого мы будем использовать [параметры запроса](/docs/ru/reference/syntax#defining-and-using-query-parameters).

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

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/8_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=ff0414e489accd078740ca3e556fd151" size="md" alt="Редактирование связанного сохранённого запроса" border width="1115" height="1600" data-path="images/cloud/dashboards/8_dashboards.webp" />

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

Теперь с помощью Global Filters на верхней панели можно переключать фильтр, изменяя значение во входном поле.

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/9_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=ce8c54aa2c7b695ec1c2195444570ec5" size="md" alt="Настройка глобальных фильтров" border width="1600" height="1045" data-path="images/cloud/dashboards/9_dashboards.webp" />

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

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/10_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=3da089a2de587264a89559b1a14764fb" size="md" alt="Изменение параметра запроса" border width="1600" height="1045" data-path="images/cloud/dashboards/10_dashboards.webp" />

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

<Image img="https://mintcdn.com/private-7c7dfe99/A68-kVUDkVcT2W3b/images/cloud/dashboards/11_dashboards.webp?fit=max&auto=format&n=A68-kVUDkVcT2W3b&q=85&s=ef565d8acc113b2cfad75757a8cfe6f1" size="md" alt="Управление фильтром линейного графика" border width="1600" height="1012" data-path="images/cloud/dashboards/11_dashboards.webp" />
