Коллеги, добрый день!

Сегодня хочу поделиться с вами интересным расширением для Qlik Sense, которое работает на основе открытой библиотеки визуализаций Google.

Спидометр как спидометр, вроде бы. Но нет! Спидометр не только интерактивен, но еще и… анимирован! Попробуйте – пользователям понравится

Спидометр Google: инструкция по установке расширения Qlik Sense

  1. Скачайте архив с данными с Qlik Branch.
  2. Распакуйте его в папку C:\Users<user>\Documents\Qlik\Sense\Extensions\GoogleGaugeChart или для серверной версии закачайте папку на сервер.

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

спидометр для Qlik Sense

  1. Теперь откройте расширение в Qlik Sense

Спидометр Google: конфигурация

Вы можете полностью настроить работу вашего расширения. Давайте обратимся к таблице со списком доступных вам настроек:
animation.duration Длительность анимации в миллисекундах.

Тип: число

По умолчанию: 400
animation.easing Настройки анимации:

  • ‘linear’ – постоянная скорость.
  • ‘in’ — Ease in – медленный старт и быстрое завершение.
  • ‘out’ — Ease out – быстрый старт и медленное завершение.
  • ‘inAndOut’ — Ease in and out – Медленный старт, ускорение и медленное завершение.

Тип: последовательность

По умолчанию: ‘linear’
forceIFrame Обрисовка графика в рамке an inline frame. (это функция не работает в IE8.)

Тип: логический

По умолчанию:false
greenColor Цвет для зеленого раздела, в цветовой схеме HTML.

Тип: последовательность

По умолчанию: ‘#109618’
greenFrom Минимальное значения для зеленого раздела спидометра.

Тип: число

По умолчанию: none
greenTo Максимальное значение для зеленого раздела спидометра.

Тип: число

По умолчанию: none
height Высота спидометра в пикселях.

Тип: число

По умолчанию: высота контейнера
majorTicks Метки для ключевых значений. Число меток определяет число ключевых делений во всех группах. По умолчанию, установлено пять делений.

Тип: Группа последовательностей

По умолчанию: none
max Максимальное значение спидометра.

Тип: число

По умолчанию: 100
min Минимальное значение спидометра.

Тип: число

По умолчанию: 0
minorTicks Число средних делений для каждого раздела основных делений.

Тип: число

По умолчанию: 2
redColor Цвет для красной секции в HTML.

Тип: последовательность

Умолчанию: ‘#DC3912’
redFrom Минимальное значение в красной секции.

Тип: число

По умолчанию: none
redTo Максимальное значение в красной секции.

Тип: число

По умолчанию: none
width Ширина спидометра в пикселях.

Тип: число

По умолчанию: ширина контейнера
yellowColor Цвет для желтой секции в HTML.

Тип: последовательность

По умолчанию: ‘#FF9900’
yellowFrom Минимальное значение в желтой секции.

Тип: число

По умолчанию: none
yellowTo Максимальное значение в желтой секции.

Тип: число

По умолчанию: none

Спидометр Google: инструкция по применения расширения Qlik Sense

Например, вы хотите использовать спидометр для приложения по аналитике заявок в helpdesk – динамичная задача, для которой анимация будет «в тему».

Для первой меры код может быть таким (лейбл «с высоким приоритетом» — High Priority Cases):

Для второй меры код (лейбл «все закрытые заявки» — Total Closed Cases):

Сделайте выборку и смотрите анимацию!

спидометр для Qlik Sense

Друзья, надеюсь, что вам будет полезно это расширения с анимацией!

Это хороший способ привлечения внимания к ключевым KPI (ну и прекрасный презентационный функционал)!

На всякий случай дублирую ссылку на архив расширением на Qlik Branch