| Предыдущая версия справа и слева Предыдущая версия Следующая версия | Предыдущая версия |
| product:dashboard:components [19.06.2019 11:02] – [Фильтр] mayn | product:dashboard:components [27.10.2025 05:46] (текущий) – ekaterina.menkhuzina |
|---|
| ====== Виджеты дашборда ====== | ====== Виджеты дашборда ====== |
| | {{tag>Реализация:настройка}} |
| | |
| | [[product/dashboard/editor|Как вывести и настроить виджеты]] |
| | |
| =====Общие ===== | =====Общие ===== |
| |
| {{:product:dashboard:widget_1.png?nolink}} <btn collapse="1_table" type="link" icon="fa fa-arrow-right">1. Таблица</btn> | ==== 1. Таблица ==== |
| <collapse collapsed="true" id="1_table"> | |
| |
| Способ структурирования данных. Предназначена для распределения данных по однотипным строкам и столбцам. | {{:product:dashboard:widget_1.png?nolink}} Способ структурирования данных. Предназначена для распределения данных по однотипным строкам и столбцам. |
| |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_1.png?nolink |}}</image> | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_1.png?nolink |Таблица}}</image> |
| <TEXT align="center">**Рисунок 1** -- Таблица</text> | |
| |
| В «Данных» таблицы вы можете настроить: | В «Данных» таблицы вы можете настроить: |
| |
| К колонкам значения привязываются автоматически. | К колонкам значения привязываются автоматически. |
| </collapse> | |
| |
| {{:product:dashboard:widget_2.png?nolink}} <btn collapse="2_table" type="link" icon="fa fa-arrow-right">2. Сводная Таблица</btn> | <callout type="warning" icon="true"> |
| <collapse collapsed="true" id="2_table"> | В таблице дашборда строки с одинаковыми значениями во всех колонках отображаются как одна строка. Чтобы отображать все строки источника в отдельных строках, добавьте в таблицу колонки с уникальными значениями для каждой строки. Например, колонку с номером строки -- такую колонку нужно создать в источнике. |
| | </callout> |
| | ==== 2. Сводная Таблица ==== |
| | {{:product:dashboard:widget_2.png?nolink}} Сводная таблица нужна для суммирования, анализа и представления данных из «больших» исходных таблиц. |
| |
| Сводная таблица нужна для суммирования, анализа и представления данных из «больших» исходных таблиц. | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_2.png?nolink |Сводная таблица}}</image> |
| | |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_2.png?nolink |}}</image> | |
| <TEXT align="center">**Рисунок 2** -- Сводная таблица</text> | |
| |
| В «Данных» сводной таблицы вы можете настроить аналогичные параметры, что и в обычной таблице. | В «Данных» сводной таблицы вы можете настроить аналогичные параметры, что и в обычной таблице. |
| |
| В сводной таблице, в отличие от простой, значения колонок необходимо задать вручную (через привязку). | В сводной таблице, в отличие от простой, значения колонок необходимо задать вручную (через привязку). |
| </collapse> | |
| |
| {{:product:dashboard:widget_3.png?nolink}} <btn collapse="3_graf" type="link" icon="fa fa-arrow-right">3. График</btn> | |
| <collapse collapsed="true" id="3_graf"> | |
| |
| График - наглядное и удобное для анализа представление табличных данных. Выберите нужный Вам тип графика из предложенных в редакторе. | ====3. График==== |
| | {{:product:dashboard:widget_3.png?nolink}} График - наглядное и удобное для анализа представление табличных данных. Выберите нужный Вам тип графика из предложенных в редакторе. |
| |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_3.png?nolink |}}</image> | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_3.png?nolink |График}}</image> |
| <TEXT align="center">**Рисунок 3** -- График</text> | |
| |
| Создание графика: | Создание графика: |
| |
| **Особенность:** Чтобы переключаться между рядами графика, вы можете создать несколько серий, которые имеют привязку к различным значениям. | **Особенность:** Чтобы переключаться между рядами графика, вы можете создать несколько серий, которые имеют привязку к различным значениям. |
| </collapse> | |
| |
| {{:product:dashboard:widget_4.png?nolink}} <btn collapse="4_tree" type="link" icon="fa fa-arrow-right">4. Древовидная диаграмма</btn> | ====4. Древовидная диаграмма==== |
| <collapse collapsed="true" id="4_tree"> | {{:product:dashboard:widget_4.png?nolink}} Древовидная диаграмма применяется для выявления и показа связи между предметом (проблемой) рассмотрения и его компонентами. |
| Древовидная диаграмма применяется для выявления и показа связи между предметом (проблемой) рассмотрения и его компонентами. | |
| |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_4.png?nolink |}}</image> | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_4.png?nolink |Древовидная диаграмма}}</image> |
| <TEXT align="center">**Рисунок 4** -- Древовидная диаграмма</text> | |
| |
| Создание древовидной диаграммы: | Создание древовидной диаграммы: |
| - привяжите значения к выбранным аргументам, выберите формат (тип, единицы измерения, точность), выполните вычисления во вкладке CALCULATIONS; | - привяжите значения к выбранным аргументам, выберите формат (тип, единицы измерения, точность), выполните вычисления во вкладке CALCULATIONS; |
| - добавьте скрытые измерения и меры, если это необходимо. | - добавьте скрытые измерения и меры, если это необходимо. |
| </collapse> | |
| |
| {{:product:dashboard:widget_5.png?nolink}} <btn collapse="5_diagram" type="link" icon="fa fa-arrow-right">5. Диаграмма</btn> | ==== 5. Диаграмма==== |
| <collapse collapsed="true" id="5_diagram"> | {{:product:dashboard:widget_5.png?nolink}} Диаграмма предназначена для сегментирования данных. Её удобно использовать, когда нужно показать долю каждой величины в общем объёме. |
| Диаграмма предназначена для сегментирования данных. Её удобно использовать, когда нужно показать долю каждой величины в общем объёме. | |
| |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_5.png?nolink |}}</image> | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_5.png?nolink |Диаграмма}}</image> |
| <TEXT align="center">**Рисунок 5** -- Диаграмма</text> | |
| |
| Создание диаграммы: | Создание диаграммы: |
| - добавьте серии рядов, чтобы мгновенно переключаться между различными параметрами диаграммы; | - добавьте серии рядов, чтобы мгновенно переключаться между различными параметрами диаграммы; |
| - добавьте скрытые измерения и меры, если это необходимо. | - добавьте скрытые измерения и меры, если это необходимо. |
| </collapse> | |
| |
| {{:product:dashboard:widget_6.png?nolink}} <btn collapse="6_diagram" type="link" icon="fa fa-arrow-right">6. Точечная диаграмма</btn> | ====6. Точечная диаграмма==== |
| <collapse collapsed="true" id="6_diagram"> | {{:product:dashboard:widget_6.png?nolink}} Точечная диаграмма используется для сравнения двух независимых переменных. Позволяет визуально увидеть разброс значений. В отличие от графика на точечной диаграмме можно представлять данные, для которых интервалы времени имеют разную величину. |
| Точечная диаграмма используется для сравнения двух независимых переменных. Позволяет визуально увидеть разброс значений. В отличие от графика на точечной диаграмме можно представлять данные, для которых интервалы времени имеют разную величину. | |
| |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_6.png?nolink |}}</image> | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_6.png?nolink |Точечная диаграмма}}</image> |
| <TEXT align="center">**Рисунок 6** -- Точечная диаграмма</text> | |
| |
| Создание точечной диаграммы: | Создание точечной диаграммы: |
| - задайте вес величин, если это необходимо; | - задайте вес величин, если это необходимо; |
| - добавьте скрытые измерения и меры, если это необходимо. | - добавьте скрытые измерения и меры, если это необходимо. |
| </collapse> | |
| |
| {{:product:dashboard:widget_7.png?nolink}} <btn collapse="7_card" type="link" icon="fa fa-arrow-right">7. Карточки</btn> | ====7. Карточки==== |
| | {{:product:dashboard:widget_7.png?nolink}} Каждая карта иллюстрирует разницу между двумя значениями. Эта разница может быть выражена как абсолютная величина, абсолютная вариация или процентное изменение. |
| |
| <collapse collapsed="true" id="7_card"> | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_7.png?nolink |Карточки}}</image> |
| Каждая карта иллюстрирует разницу между двумя значениями. Эта разница может быть выражена как абсолютная величина, абсолютная вариация или процентное изменение. | |
| | |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_7.png?nolink |}}</image> | |
| <TEXT align="center">**Рисунок 7** -- Карточки</text> | |
| |
| Создание карточек: | Создание карточек: |
| - добавьте серии рядов, чтобы мгновенно переключаться между различными параметрами карточек; | - добавьте серии рядов, чтобы мгновенно переключаться между различными параметрами карточек; |
| - добавьте скрытые измерения и меры, если это необходимо. | - добавьте скрытые измерения и меры, если это необходимо. |
| </collapse> | |
| |
| {{:product:dashboard:widget_8.png?nolink}} <btn collapse="8_indicator" type="link" icon="fa fa-arrow-right">8. Индикаторы</btn> | ==== 8. Индикаторы ==== |
| <collapse collapsed="true" id="8_indicator"> | {{:product:dashboard:widget_8.png?nolink}} Индикаторы – хорошие аналитические инструменты. Отображая ситуацию они помогают понять поведение тренда в конкретный момент времени и найти решение той или иной проблемы. |
| Индикаторы – хорошие аналитические инструменты. Отображая ситуацию они помогают понять поведение тренда в конкретный момент времени и найти решение той или иной проблемы. | |
| |
| <callout type="info">Индикаторы используются для отображения значения одной меры, без измерений.</callout> | <callout type="info">Индикаторы используются для отображения значения одной меры, без измерений.</callout> |
| |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_8.png?nolink |}}</image> | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_8.png?nolink |Индикаторы}}</image> |
| <TEXT align="center">**Рисунок 8** -- Индикаторы</text> | |
| |
| Создание индикаторов: | Создание индикаторов: |
| - добавьте серии рядов, чтобы мгновенно переключаться между различными параметрами индикаторов; | - добавьте серии рядов, чтобы мгновенно переключаться между различными параметрами индикаторов; |
| - добавьте скрытые измерения и меры, если это необходимо. | - добавьте скрытые измерения и меры, если это необходимо. |
| </collapse> | |
| |
| {{:product:dashboard:widget_9.png?nolink}} <btn collapse="9_text" type="link" icon="fa fa-arrow-right">9. Текст</btn> | ==== 9. Текст ==== |
| <collapse collapsed="true" id="9_text"> | {{:product:dashboard:widget_9.png?nolink}} Текст может привлечь внимание к наиболее важным показателям и пояснить содержание дашборда. |
| Текст может привлечь внимание к наиболее важным показателям и пояснить содержание дашборда. | |
| |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_9.png?nolink |}}</image> | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_9.png?nolink |Текст}}</image> |
| <TEXT align="center">**Рисунок 9** -- Текст</text> | |
| |
| Создание текстовых заметок: | Создание текстовых заметок: |
| |
| <callout type="info">Поддерживаются файлы только в формате RTF.</callout> | <callout type="info">Поддерживаются файлы только в формате RTF.</callout> |
| </collapse> | |
| |
| {{:product:dashboard:widget_10.png?nolink}} <btn collapse="10_img" type="link" icon="fa fa-arrow-right">10. Картинка</btn> | ==== 10. Картинка ==== |
| <collapse collapsed="true" id="10_img"> | {{:product:dashboard:widget_10.png?nolink}} Картинка аналогично тексту поможет привлечь внимание и пояснить содержание дашборда. |
| Картинка аналогично тексту поможет привлечь внимание и пояснить содержание дашборда. | |
| |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_10.png?nolink |}}</image> | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_10.png?nolink |Картинка}}</image> |
| <TEXT align="center">**Рисунок 10** -- Картинка</text> | |
| |
| Создание картинки: | Создание картинки: |
| - задайте нужное выравнивание по горизонтали и по вертикали; | - задайте нужное выравнивание по горизонтали и по вертикали; |
| - измените размер изображения. | - измените размер изображения. |
| </collapse> | |
| |
| {{:product:dashboard:widget_11.png?nolink}} <btn collapse="11_img" type="link" icon="fa fa-arrow-right">11. Привязанное изображение</btn> | ====11. Привязанное изображение==== |
| <collapse collapsed="true" id="11_img"> | {{:product:dashboard:widget_11.png?nolink}} Отличается от картинки тем, что здесь можно задать атрибуты и привязать к ним значения. |
| Отличается от картинки тем, что здесь можно задать атрибуты и привязать к ним значения. | |
| </collapse> | |
| |
| {{:product:dashboard:widget_12.png?nolink}} <btn collapse="12_group" type="link" icon="fa fa-arrow-right">12. Группа</btn> | ==== 12. Группа ==== |
| <collapse collapsed="true" id="12_group"> | {{:product:dashboard:widget_12.png?nolink}} Позволяет поместить несколько виджетов в одну область дашборда для более удобной визуализации. |
| |
| Позволяет поместить несколько виджетов в одну область дашборда для более удобной визуализации. | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_11.png?nolink |Группа}}</image> |
| | |
| <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_11.png?nolink |}}</image> | |
| <TEXT align="center">**Рисунок 11** -- Группа</text> | |
| |
| Создание группы: | Создание группы: |
| - перетащите в его область уже существующие виджеты или создайте новые. | - перетащите в его область уже существующие виджеты или создайте новые. |
| |
| </collapse> | |
| |
| ===== Карты ===== | ===== Карты ===== |
| Чтобы карты работали, в таблице-источнике должны содержаться географические координаты.// | Чтобы карты работали, в таблице-источнике должны содержаться географические координаты.// |
| |
| {{:product:dashboard:widget_13.png?nolink|}} **Точечная картограмма**. Разновидность картограммы, на которой уровень интенсивности признака графически показан с помощью точек, размещенных на контурной карте какой-либо территориальной единицы. | ==== Точечная картограмма ==== |
| | {{:product:dashboard:widget_13.png?nolink }} Разновидность картограммы, на которой уровень интенсивности признака графически показан с помощью точек, размещенных на контурной карте какой-либо территориальной единицы. |
| |
| {{:product:dashboard:widget_14.png?nolink|}} **Фоновая картограмма**. Позволяет с помощью окраски различной густоты или цвета показывать интенсивность развития какого-либо признака в пределах территориальной единицы. | ==== Фоновая картограмма ==== |
| | {{:product:dashboard:widget_14.png?nolink }} Позволяет с помощью окраски различной густоты или цвета показывать интенсивность развития какого-либо признака в пределах территориальной единицы. |
| |
| {{:product:dashboard:widget_15.png?nolink|}} **Пузырьковая картограмма**. Разновидность точечной картограммы, в которой точки данных заменены пузырьками. Отображает на плоскости наборы из трех значений. Первые два значения определяют точку расположения пузырька, а третье значение выражается размером пузырька. | ====Пузырьковая картограмма ==== |
| | {{:product:dashboard:widget_15.png?nolink }} Разновидность точечной картограммы, в которой точки данных заменены пузырьками. Отображает на плоскости наборы из трех значений. Первые два значения определяют точку расположения пузырька, а третье значение выражается размером пузырька. |
| |
| {{:product:dashboard:widget_16.png?nolink|}} **Диаграммная картограмма**. Позволяет с помощью диаграммных фигур изображать величины какого-либо статистического показателя в пределах каждой единицы нанесенного на карту территориального деления. | ==== Диаграммная картограмма ==== |
| | {{:product:dashboard:widget_16.png?nolink }} Позволяет с помощью диаграммных фигур изображать величины какого-либо статистического показателя в пределах каждой единицы нанесенного на карту территориального деления. |
| |
| ===== Фильтр ===== | ===== Фильтры ===== |
| |
| {{:product:dashboard:widget_17.png?nolink|}} **Фильтр диапазона**. Фильтр помогает регулировать данные. Например, для диаграммы продаж с динамикой по времени фильтр можно использовать для отображения продаж только за выбранный период времени, по определенным категориям продукции или по определенному региону. | <callout type="warning" icon="true">Если в дашборде используется несколько фильтров, то в их интерактивности по умолчанию рекомендуется устанавливать: |
| | * «Игнорировать сквозные фильтры» -- ВКЛ, |
| | * перекрестная фильтрация -- ВЫКЛ. |
| | </callout> |
| |
| {{:product:dashboard:widget_18.png?nolink|}} **Раскрывающийся список**. Позволяет выбирать одно из нескольких заранее определённых значений параметра, при переключении между которыми будет меняться визуальное представление других виджетов. Представляет собой выпадающий список параметров. | ====1. Фильтр диапазона==== |
| | {{:product:dashboard:widget_17.png?nolink|}} Помогает регулировать данные. Например, для диаграммы продаж с динамикой по времени фильтр можно использовать для отображения продаж только за выбранный период времени, по определенным категориям продукции или по определенному региону. |
| |
| {{:product:dashboard:widget_19.png?nolink|}} **Список**. Позволяет выбирать одно из нескольких заранее определённых значений параметра, при переключении между которыми будет меняться визуальное представление других виджетов. | На рисунке ниже представлен график выручки за последние три года. |
| |
| {{:product:dashboard:widget_20.png?nolink|}} **Дерево выбора**. Позволяет выбирать одно из нескольких заранее определённых значений параметра, при переключении между которыми будет меняться визуальное представление других виджетов. Представляет собой иерархический список. | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_12.png?nolink |График общей выручки}}</image> |
| | |
| | С помощью инструмента «Преобразовать в» {{:product:dashboard:dashboard_filter_0.png?nolink|}} преобразуем этот график в фильтр диапазона. |
| | |
| | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_13.png?nolink |Фильтр диапазона}}</image> |
| | |
| | В окне нового виджета в правом верхнем углу появится кнопка «Выберите период даты и времени» {{:product:dashboard:dashboard_filter_1.png?nolink|}}. \\ |
| | После нажатия на кнопку откроется окно выбора диапазона. |
| | |
| | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_14.png?nolink |Выбор диапазона}}</image> |
| | |
| | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_15.png?nolink |Выбранный диапазон дат}}</image> |
| | |
| | Создание фильтра диапазона: |
| | - задайте аргумент; |
| | - привяжите к нему значения; |
| | - придайте значениям нужный вид (тип, способ вычисления); |
| | - добавьте серии рядов, чтобы мгновенно переключаться между различными параметрами фильтра; |
| | - добавьте скрытые измерения и меры, если это необходимо. |
| | |
| | ====2. Раскрывающийся список==== |
| | {{:product:dashboard:widget_18.png?nolink}} Позволяет выбирать одно из нескольких заранее определённых значений параметра, при переключении между которыми будет меняться визуальное представление других виджетов. Представляет собой выпадающий список параметров. |
| | |
| | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_16.png?nolink |Раскрывающийся список}}</image> |
| | |
| | Создание раскрывающегося списка: |
| | - задайте измерения, значения которых будут появляться в выпадающем списке и при переключении между которыми будет меняться визуальное представление других виджетов; |
| | - добавьте скрытые измерения и меры, если это необходимо. |
| | |
| | ====3. Список==== |
| | {{:product:dashboard:widget_19.png?nolink}} Позволяет выбирать одно из нескольких заранее определённых значений параметра, при переключении между которыми будет меняться визуальное представление других виджетов. |
| | |
| | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_17.png?nolink |Список}}</image> |
| | |
| | Создание списка: |
| | - задайте измерения, при переключении между которыми будет меняться визуальное представление других виджетов; |
| | - добавьте скрытые измерения и меры, если это необходимо. |
| | |
| | ====4. Дерево выбора==== |
| | {{:product:dashboard:widget_20.png?nolink}} Позволяет выбирать одно из нескольких заранее определённых значений параметра, при переключении между которыми будет меняться визуальное представление других виджетов. Представляет собой иерархический список. |
| | |
| | <image shape="thumbnail">{{ :product:dashboard:dashboard_editor_18.png?nolink |Дерево выбора}}</image> |
| | |
| | Создание дерева выбора: |
| | - задайте измерения, при переключении между которыми будет меняться визуальное представление других виджетов; |
| | - добавьте скрытые измерения и меры, если это необходимо. |