---
title: Виджеты
description: Изучите типы виджетов и варианты визуализации в Twenty.
---

import { ChartIcon } from '/snippets/chart-icon.mdx';

## Доступные виджеты

Twenty предоставляет различные типы виджетов для визуализации данных вашей CRM-системы.

### <span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}><ChartIcon icon="chart-bar-popular" />Гистограммы</span>

Отображайте данные в виде горизонтальных или вертикальных столбцов.

<Frame>
<img src="/images/user-guide/dashboard/dashboard-widget-bar-chart.png" alt="Гистограмма" />
</Frame>

**Лучше всего подходит для:**

* Сравнение значений по категориям
* Отображение рейтингов
* Отслеживание метрик по периодам времени

**Примеры использования:**

* Сделки по этапам
* Выручка по менеджерам по продажам
* Контакты, добавленные по месяцам

<Note>
**Ограничения отображения**: Гистограммы могут отображать максимум 100 столбцов и 50 групп на столбец при использовании "Group By". Если вы видите предупреждение "Undisplayed data: max X bars per chart", добавьте фильтры, чтобы сузить данные, или измените группировку (например, группируйте по неделям вместо дней).
</Note>

### <span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}><ChartIcon icon="chart-pie" />Круговые диаграммы</span>

Показывайте доли целого.

<Frame>
<img src="/images/user-guide/dashboard/dashboard-widget-pie-chart.png" alt="Круговая диаграмма" />
</Frame>

**Лучше всего подходит для:**

* Отражение состава или распределения
* Сравнение частей с целым
* Выделение ключевых сегментов

**Примеры использования:**

* Распределение сделок по источникам
* Разбивка контактов по отраслям
* Состав воронки по ответственным

### <span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}><ChartIcon icon="chart-line" />Линейные диаграммы</span>

Отображайте динамику во времени.

<Frame>
<img src="/images/user-guide/dashboard/dashboard-widget-line-chart.png" alt="Линейная диаграмма" />
</Frame>

**Лучше всего подходит для:**

* Отслеживание изменений во времени
* Определение тенденций
* Сравнение нескольких метрик

**Примеры использования:**

* Динамика количества сделок по месяцам
* Рост выручки по кварталам
* Динамика уровня активности

### <span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}><ChartIcon icon="sum" />Сводные диаграммы</span>

Наглядно отображайте отдельные ключевые значения.

<Frame>
<img src="/images/user-guide/dashboard/dashboard-widget-aggregate-chart.png" alt="Сводная диаграмма" />
</Frame>

**Лучше всего подходит для:**

* Выделение KPI
* Показ итогов или средних значений
* Быстрые проверки статуса

**Примеры использования:**

* Общий объем воронки
* Число открытых сделок
* Коэффициент конверсии

**Расширенные параметры:**

* **Ratio**: Для полей типа Select вычисляйте соотношения между значениями. Перейдите в **Отображаемые данные** → выберите поле → включите параметр **Ratio**.
* **Префикс и суффикс**: Добавляйте произвольный текст до или после числа (например, префикс "$" или суффикс "%") для лучшей читаемости.

### <span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}><ChartIcon icon="frame" />iFrames</span>

Встраивайте внешние инструменты и контент прямо в ваш дашборд.

<Frame>
<img src="/images/user-guide/dashboard/dashboard-widget-iframe.png" alt="iFrame" />
</Frame>

**Лучше всего подходит для:**

* Отображение внешних отчетов или дашбордов
* Интеграция сторонних инструментов продаж
* Отображение данных в реальном времени из других систем

**Примеры использования:**

* Метрики из вашего сервиса поддержки
* Метрики из вашей системы обзвона
* Контент в реальном времени из вашего инструмента последовательностей продаж

### <span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}><ChartIcon icon="align-box-left-top" />Форматированный текст</span>

Добавляйте форматированный текст и контент прямо в ваш дашборд.

<Frame>
<img src="/images/user-guide/dashboard/dashboard-widget-rich-text.png" alt="Форматированный текст" />
</Frame>

**Лучше всего подходит для:**

* Добавление контекста или инструкций
* Описания дашборда
* Заметки и аннотации

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

* Форматирование текста (полужирный, курсив, списки и т. д.)
* Загрузка изображений и файлов
* Редактирование в стиле Markdown

<Note>
**Скоро**: Индикаторные диаграммы и таблицы пока недоступны, но есть в нашей дорожной карте.
</Note>

### Дублирование виджетов

1. Нажмите на виджет
2. Откройте **Параметры**
3. Нажмите **Дублировать виджет**