github-actions[bot]
b7fbe1c49e
Created by Github action Co-authored-by: github-actions <github-actions@twenty.com>
150 lines
6.2 KiB
Plaintext
150 lines
6.2 KiB
Plaintext
---
|
|
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" />Bar Charts</span>
|
|
|
|
Отображайте данные в виде горизонтальных или вертикальных столбцов.
|
|
|
|
<Frame>
|
|
<img src="/images/user-guide/dashboard/dashboard-widget-bar-chart.png" alt="Bar chart" />
|
|
</Frame>
|
|
|
|
**Лучше всего подходит для:**
|
|
|
|
* Сравнение значений по категориям
|
|
* Отображение рейтингов
|
|
* Отслеживание метрик по периодам времени
|
|
|
|
**Примеры использования:**
|
|
|
|
* Сделки по этапам
|
|
* Выручка по менеджерам по продажам
|
|
* Контакты, добавленные по месяцам
|
|
|
|
<Note>
|
|
**Display limits**: Bar charts can show a maximum of 100 bars, and 50 groups per bar when using Group By. Если вы видите предупреждение "Undisplayed data: max X bars per chart", добавьте фильтры, чтобы сузить данные, или измените группировку (например, группируйте по неделям вместо дней).
|
|
</Note>
|
|
|
|
### <span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}><ChartIcon icon="chart-pie" />Pie Charts</span>
|
|
|
|
Показывайте доли целого.
|
|
|
|
<Frame>
|
|
<img src="/images/user-guide/dashboard/dashboard-widget-pie-chart.png" alt="Pie chart" />
|
|
</Frame>
|
|
|
|
**Лучше всего подходит для:**
|
|
|
|
* Отражение состава или распределения
|
|
* Сравнение частей с целым
|
|
* Выделение ключевых сегментов
|
|
|
|
**Примеры использования:**
|
|
|
|
* Распределение сделок по источникам
|
|
* Разбивка контактов по отраслям
|
|
* Состав воронки по ответственным
|
|
|
|
### <span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}><ChartIcon icon="chart-line" />Line Charts</span>
|
|
|
|
Отображайте динамику во времени.
|
|
|
|
<Frame>
|
|
<img src="/images/user-guide/dashboard/dashboard-widget-line-chart.png" alt="Line chart" />
|
|
</Frame>
|
|
|
|
**Лучше всего подходит для:**
|
|
|
|
* Отслеживание изменений во времени
|
|
* Определение тенденций
|
|
* Сравнение нескольких метрик
|
|
|
|
**Примеры использования:**
|
|
|
|
* Динамика количества сделок по месяцам
|
|
* Рост выручки по кварталам
|
|
* Динамика уровня активности
|
|
|
|
### <span style={{ display: 'inline-flex', alignItems: 'center', gap: '8px' }}><ChartIcon icon="sum" />Aggregate Charts</span>
|
|
|
|
Наглядно отображайте отдельные ключевые значения.
|
|
|
|
<Frame>
|
|
<img src="/images/user-guide/dashboard/dashboard-widget-aggregate-chart.png" alt="Aggregate chart" />
|
|
</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" />Rich Text</span>
|
|
|
|
Add formatted text and content directly to your dashboard.
|
|
|
|
<Frame>
|
|
<img src="/images/user-guide/dashboard/dashboard-widget-rich-text.png" alt="Rich text" />
|
|
</Frame>
|
|
|
|
**Лучше всего подходит для:**
|
|
|
|
* Adding context or instructions
|
|
* Dashboard descriptions
|
|
* Notes and annotations
|
|
|
|
**Features:**
|
|
|
|
* Rich text formatting (bold, italic, lists, etc.)
|
|
* Image and file uploads
|
|
* Markdown-style editing
|
|
|
|
<Note>
|
|
**Скоро**: Индикаторные диаграммы и таблицы пока недоступны, но есть в нашей дорожной карте.
|
|
</Note>
|
|
|
|
### Дублирование виджетов
|
|
|
|
1. Нажмите на виджет
|
|
2. Откройте **Параметры**
|
|
3. Нажмите **Дублировать виджет**
|