/
Справочник визуализаций

Справочник визуализаций

На данной странице представлен сборник различных примеров и лайфхаков по визуализации на платформе по адресу https://example.visiology.su (demo/123456).

Имена дашбордов обычно идентичны названиям примеров, поэтому найти их в Дизайнере не составит труда.

Наименование

Описание

Наименование

Описание

Public | Диаграмма с пагинацией

На виджете представлен пример диаграммы с листами, которые можно переключать.

Public | Дриллдаун и его обработка

Описание кастомного дрилдауна с помощью visApi. 

Public | Заглушка при выполн. загрузчика

Пример заглушки виджета на время выполнения загрузчика.

Public | Карта с кластеризацией маркеров

Пример карты с кластеризацией маркеров.

Public | Картосхема

Пример картосхемы.

Public | Картосхема с drill-down

Пример картосхему с возможностью провалиться в страны\регионы и тд.

Public | Пузырьковая диаграмма

Пример bubble chart.

Public | Синхронные фильтры

Пример работы синхронных фильтров с помощью доп библиотеки.

Public | Скрытие виджета по фильтру

Пример скрытия виджетов в зависимости от значения фильтра.

Public | Установка фильтра по датам

Установка значений в фильтр по датам через код.

Public | Множественная карточка в модальном окне

Пример реализации карточек с помощью модального окна, которое открывается по клику.

Public | Множественная карточка

Кастомная реализация карточек. Строятся динамически.

Public | Сводная как фильтр

Использование значений сводной таблицы в качетве фильтра.

Public | Синхронизация Диаграммы и Фильтра

Синхронная работа фильтра и диаграмма (взаимное влияние)

Public | Сортируемая таблица с несколькими измерениями

Таблица с возможностью сортировки каждого столбца.

Public | Фильтр checkbox

Фильтр в виде чекбокса.

Public | Popup

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

Public | Числовой фильтр

Фильтрация показателей по диапазону на основе Python и расчётных столбцов

Public | JQuery Datatable

Таблица на основе библиотеки JQuery DataTables. Легко кастомизируется, очень много фич.

Public | Переход на 2 лист с устан. фильтра

Клик на один из виджетов текст вызывает переход на второй лист с установкой значения из этого виджета текст в виджет фильтр на втором листе. Фильтр на втором листе влияет на гистограмму. В итоге получаем после перехода сразу отфильтрованные значения на гистограмме.

Public | Выбор показателя через фильтр

Выбор отображаемого показателя через фильтр.

Public | Карта-схема количество полётов

Дашборд с картой-схемой лётных зон.

Public | Окраска значений таблицы

Окраска значений сводной таблицы в зависимости от значений соседнего столбца

Public | Highcharts gantt

Построение диаграммы Гантта на библиотеке Highcharts

Public | Транспонирование данных в Круговой диаграмме

Транспонирование данных в круговой диаграмме для отображения нескольких показателей | patterns-fill

Public | Круговая с остатком

Сектора с долей менее 10% складываются в один сектор, в который можно сделать дриллдаун и посмотреть данные по ним.

Public | Гант (jsganttimproved lib)

Построение диаграммы Гантта на библиотеке jsganttimproved

Public | Лепестковая диаграмма / Spiderweb

Построение лепестковой диаграммы на библиотеке Highcharts

Public | График с подсветкой диапазонов

Настройка цвета для разных диапазонов значений. Выделение диапазонов точек на осиХ. Включение горизонтальной прокрутки.

Public | Custom fonts

Добавление новых шрифтов в виджеты

Public | Leaflet - Interactive Choropleth Map

Карта на библиотеке Leaflet с дополнительным слоем geojson, который раскрашивается в зависимости от значения показателя.
Напоминает обычную карту схему, но основа карта openstreetmap.

Public | Фильтрация показателя (расчётный столбец)

С помощью фильтра изменяем значения данных показателя, отображаемых на гистограме.

Public | Переход по кнопке на другой дашборд

Переход по кнопке на другой дашборд

Public | Dependency-wheel

Dependency-wheel реализован на основании данных грузоперевозок

Public | honeycomb(tilemap)

Honeycomb(tilemap) карта регионов России отображённая сотами

Public | TreeView-фильтр с поиском по всем уровням

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

Public | Взаимное влияние

Пример кастомного механизма взаимного влияния диаграмм друг на друга.

Public | Listbox

Фильтр listbox отображающий значения фильтра как кнопки, которые можно выбирать.

Public | 3D pie chart

3D круговая диаграмма. Реализована стандартными средствами библиотеки highcharts.

Public | Ссылка с установленным фильтров

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

Public | Сортировка в стеке по возрастанию

Сортировка серий внутри стека при накоплении

Public | Funnel chart

Пример виджета “Воронка” на библиотеке Highcharts

Public | Switch button

Пример кнопки переключателя для включении фильтрации по фиксированным элементам измерения

Public | Мониторинг пользователей

Таблицы отображающие количество пользователей по ролям

Public | Calendar ECharts

Виджет отображает календарь из 12 месяцев. Используется тип серии heatmap из-за чего, цвет ячейки для даты зависит от значения показателя за эту дату.

Public | Спидометр

Кастомный спидометр в двух стилях

 

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

 

Related content

Кейс 1: графики в ячейках таблицы
Кейс 1: графики в ячейках таблицы
Read with this
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
More like this
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
More like this
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
More like this
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
More like this
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
Случай 3. Сертификат, подписанный центром сертификации уровня предприятия
More like this