AnyChart Extension для Qlik: Sunburst Chart

Основы

Загрузка и установка

Qlik Sense Desktop

Чтобы установить AnyChart Sunburst Extension в Qlik Sense Desktop, выполните следующее:

Загрузите AnyChart Sunburst Extension для Qlik Sense.
Распакуйте архив.
Откройте проводник Windows и перейдите в каталог Qlik Sense Extensions:
..\Users\<UserName>\Documents\Qlik\Sense\Extensions.
Скопируйте папку anygantt-4x-sunburst в каталог Extensions.
Перезапустите Qlik Sense Desktop.

Qlik Sense Server

Чтобы установить AnyChart Sunburst Extension на сервер Qlik Sense,

Загрузите AnyChart Sunburst Extension для Qlik Sense.
Откройте Qlik Management Console (QMC): https://<QPS server name>/qmc
Выберите Extensions на начальной странице QMC или в выпадающем меню Start.
Нажмите Import на панели действий.
В диалоговом окне выберите загруженный архив. Оставьте поле пароля пустым.
Нажмите Open в окне проводника.
Нажмите Import.

Qlik Sense Cloud

Чтобы установить AnyChart Sunburst Extension в Qlik Sense Cloud, выполните следующее:

Загрузите AnyChart Sunburst Extension для Qlik Sense Cloud.
Перейдите в Management Console:
- добавьте /console к адресу вашего тенанта: https://<your tenant address>/console
- или воспользуйтесь навигационной ссылкой Administration под профилем пользователя в хабе

Перейдите на страницу Extensions и нажмите Add.
В диалоговом окне выберите загруженный архив.
Нажмите Add.
В Management Console перейдите в раздел Content Security Policy и нажмите Add.
В диалоговом окне дайте политике безопасности контента имя – например, AnyChart.
Введите адрес исходного сервера: qlik.anychart.com
Выберите следующие директивы:
- connect-src
- font-src
- img-src
- script-src
- style-src

Нажмите Add.

Обзор

Sunburst chart, также известный как радиальная древовидная карта или многоуровневая круговая диаграмма, представляет собой визуализацию, отображающую иерархически организованные данные в виде набора вложенных колец, разделенных на сегменты. Размеры сегментов представляют их значения.

Прочитайте разделы Quick Start и Dimensions and Measures, чтобы узнать, как добавить Sunburst chart и какие измерения и меры использовать.

Вы можете настроить внешний вид диаграммы: задать цвета и inner radius, добавить center content, а также настроить метки и подсказки.

Также доступны следующие опции: интерактивность, условия расчета.

An AnyChart sunburst chart with three levels of the hierarchy and the center content enabled

Быстрый старт

Этот краткий учебник объясняет, как создать базовый Sunburst chart.

Прежде всего, добавьте пустую диаграмму на свой лист:

Перейдите в Custom objects > AnyChart на панели ресурсов.
Перетащите пустую диаграмму AnyChart Sunburst на лист.

Затем добавьте два измерения:

Перейдите в Dimensions на панели свойств.
Нажмите Add dimension и выберите измерение.
Нажмите Add dimension и выберите измерение.

Наконец, добавьте меру, которая используется для расчета размеров сегментов:

Перейдите в Measures на панели свойств.
Нажмите Add measure и выберите меру.

Обратите внимание, что вы также можете создавать измерения и меры из полей или добавлять их, нажимая кнопки на пустой диаграмме.

A basic sunburst chart built with AnyChart Sunburst for Qlik Sense Extension

Измерения и меры

Измерения

Чтобы добавить измерение, выполните следующее:

Перейдите в Dimensions на панели свойств.
Нажмите Add dimension и выберите измерение.

Для Sunburst chart требуется только одно измерение. Однако с одним измерением он выглядит как обычная (одноуровневая) круговая диаграмма. Чтобы создать многоуровневую диаграмму, добавьте два или более измерения.

Пожалуйста, имейте в виду, что измерения необходимо расположить в правильном порядке, от верхних уровней к нижним: просто перетащите их на панели свойств.

AnyChart Sunburst может отображать иерархические данные с одним корнем или несколькими корнями:

A sunburst chart displaying hierarchical data with one root

A sunburst chart displaying hierarchical data with several roots

Каждый сегмент диаграммы имеет текстовую метку, которая отображает его измерение и меру. Но при необходимости метки могут отображать другой текст. Например, вы можете использовать числовые идентификаторы категорий в качестве измерения и в то же время отображать названия категорий в качестве меток. См. раздел Метки, чтобы узнать больше.

Меры

Чтобы добавить меру, выполните следующее:

Перейдите в Measures на панели свойств.
Нажмите Add measure и выберите меру.

Мера используется для расчета размеров сегментов. В своих визуализациях вы можете использовать любые меры с любыми агрегациями, а также задавать меры в виде пользовательских выражений. Например, вы можете использовать пользовательское выражение, чтобы скрыть слишком мелкие сегменты.

Внешний вид

Color by Expression

Сегменты диаграммы окрашены по палитре по умолчанию. В качестве альтернативы вы можете окрасить их с помощью выражения.

Окрашивание по выражению задает цвета с помощью определяемого пользователем выражения. При окрашивании по выражению вы можете определить как используемые цвета, так и значения, с которыми они будут использоваться, что обеспечивает больший контроль над тем, как цвета используются в визуализации. Например, вы можете выделить представляющие особый интерес значения или разграничить значения в разных диапазонах значений. Окрашивание по выражению также можно использовать для окрашивания визуализации по значениям, не включенным в визуализацию.

Чтобы окрасить сегменты по выражению, выполните следующее:

Перейдите в Appearance > Colors на панели свойств.
Переключите ползунок Colors.
Выберите By expression в первом выпадающем меню.
Введите выражение в поле ввода.

Примеры

Пример: Окрашивание по родителю

Pick(Match(RegionName, 
'South', 'West', 'Midwest', 'Northeast'), 
'#d29b9b', '#57a7b1', '#5785b2', '#bdbdbd')

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

A sunburst chart with the slices colored by expression (by parent group)

Пример: Окрашивание по уровню иерархии

If(Dimensionality() = 1, '#d29b9b', 
If(Dimensionality() = 2, '#57a7b1',
If(Dimensionality() = 3, '#bdbdbd')))

В этом примере 3 цвета разграничивают сегменты, принадлежащие к 3 различным уровням иерархии.

A sunburst chart with the slices colored by expression (by hierarchy level)

Пример: Окрашивание по мере

If(Sum(CENSUS2010POP) >= 30000000, '#d29b9b', 
If(Sum(CENSUS2010POP) >= 10000000, '#57a7b1',
'#bdbdbd'))

Здесь 3 цвета обозначают 3 размера населения: >= 30 млн, >= 10 млн и < 30 млн, и остальные (< 10 млн).

A sunburst chart with the slices colored by expression (by measure)

Пример: Окрашивание по альтернативной мере

If(Avg(RNATURALINC2011) <= 0, '#d29b9b',
If(Avg(RNATURALINC2011) < Avg(TOTAL{1<Country = {'U.S.'}>}RNATURALINC2011), '#bdbdbd',
If(Avg(RNATURALINC2011) >= Avg(TOTAL{1<Country = {'U.S.'}>}RNATURALINC2011), '#57a7b1')))

Здесь 3 цвета обозначают 3 типа коэффициента естественного прироста: <= 0 (красный), > 0, но ниже общего среднего (серый), и выше или равно общему среднему (зеленый). Размеры сегментов представляют другую меру – размер населения.

A sunburst chart with the slices colored by expression (by an alternative measure not included within the visualization)

Inner Radius

Вы можете настроить inner radius диаграммы, чтобы задать размер свободного пространства в центре.

По умолчанию inner radius равен 0%: центр занят родительскими элементами, и свободного места не остается:

A sunburst chart with the inner radius set to 0

Чтобы установить inner radius, выполните следующее:

Перейдите в Appearance > Presentation на панели свойств.
Используйте опцию Inner radius.

A sunburst chart with the inner radius set to a positive value

Вы можете использовать пространство в центре для отображения center content.

Center Content

Когда inner radius больше 0, в центре диаграммы появляется свободное пространство. Вы можете использовать его для отображения дополнительной информации:

Перейдите в Appearance > Presentation на панели свойств.
Введите выражение в поле ввода Center content.

Обратите внимание, что содержимое центра можно задать либо как строковое значение, либо как произвольное строковое выражение. Кроме того, вы можете использовать HTML, как в примере ниже:

'<b>POPULATION<br><span style=color:red><i>' &
Round(Sum(CENSUS2010POP) / 1000000, 0.1) & 'M</i></span></b>

A sunburst chart with the center content enabled and formatted with the help of HTML

Метки

Метки — это текстовые объекты, отображающие информацию о сегментах диаграммы.

По умолчанию каждая метка отображает измерение и меру сегмента, но вы можете настроить текст:

Перейдите в Appearance > Label на панели свойств.
Выберите формат метки в выпадающем меню Text.
Если вы выберете формат Expression, введите выражение в поле ввода.

Доступны следующие форматы меток:

Формат метки	Описание
Dimension	Каждая метка отображает измерение, соответствующее сегменту.
Dimension and measure	Каждая метка отображает измерение и меру, соответствующие сегменту.
Measure only outside	Метки внешнего кольца, представляющего последний (самый низкий) уровень иерархии, отображают измерения и меры. Метки всех внутренних колец отображают только измерения.
Measure only inside	Метки всех внутренних колец отображают измерения и меры. Метки внешнего кольца, представляющего последний (самый низкий) уровень иерархии, отображают только измерения.
Expression	Метки отображают пользовательский (определяемый пользователем) текст.

Dimension

A sunburst chart with the labels displaying dimensions

Dimension and Measure

A sunburst chart with the labels displaying dimensions and measures

Measure only Outside

A sunburst chart with the labels displaying dimensions and measures in the outside ring and dimensions in all the inside rings

Measure only Inside

A sunburst chart with the labels displaying dimensions in the outside ring and dimensions and measures in all the inside rings

Обратите внимание, что если вы выберете опцию Expression, текст метки можно будет задать либо как строковое значение, либо как произвольное строковое выражение. Использование выражений позволяет выделять значения, представляющие особый интерес, отображать значения, не включенные в визуализацию, или результаты вычислений и так далее.

В приведенном ниже примере сегменты на разных уровнях иерархии отображают разные метки:

If(Dimensionality() = 1, Country & ' POPULATION',

If(Dimensionality() = 2,
Upper(RegionName) & ': ' & Round(Sum(CENSUS2010POP) / 1000000, 0.1) & 'M',

If(Dimensionality() = 3, StateCodes)))

A sunburst chart with the labels displaying different texts at different hierarchy levels

Подсказки

Подсказки — это текстовые блоки, которые появляются при наведении курсора на сегменты диаграммы. Вы можете задать пользовательский текст подсказки.

Обратите внимание, что текст подсказки можно задать либо как строковое значение, либо как произвольное строковое выражение. Использование выражений позволяет выделять значения, представляющие особый интерес, отображать значения, не включенные в визуализацию, или результаты вычислений и так далее.

Также в подсказках вы можете использовать HTML.

Чтобы включить или отключить подсказки, перейдите в Interactivity на панели свойств и переключите ползунок Tooltips.

Чтобы настроить текст подсказки,

Перейдите в Appearance > Tooltip на панели свойств.
Переключите ползунок Tooltip text.
Введите строковое значение или строковое выражение в поле ввода.

Подсказки разных сегментов могут отображать разный текст. Например, текст может меняться в зависимости от уровня иерархии:

If(Dimensionality() = 1,
'<b>' & Upper(RegionName) & '</b><br><i>Region</i>' &
'<hr>States: ' & Count(State) & '<br>',

If(Dimensionality() = 2,
'<b>' & Upper(DivisionName) & '</b><br><i>Division</i>' &
'<hr>States: ' & Count(State) & '<br>',

If(Dimensionality() = 3,
'<b>' & Upper(State) & '</b><br><i>State</i><hr>'))) &

'Population: ' & Round(Sum(CENSUS2010POP) / 1000000, 0.1) & 'M'

A sunburst chart with a tooltip displaying a custom text for a slice at the first hierarchy level

A sunburst chart with a tooltip displaying a custom text for a slice at the second hierarchy level

A sunburst chart with a tooltip displaying a custom text for a slice at the last hierarchy level

Другие функции

Интерактивность

По умолчанию доступны следующие функции интерактивности: выбор, снимки (snapshots) и подсказки. Кроме того, вы можете установить режим выбора или включить детализацию (drilldown) вместо выбора.

Чтобы включить или отключить эти функции, перейдите в Interactivity на панели свойств и используйте следующие функции:

Selection и Dimension
Enable drilldown
Snapshots
Tooltips

Когда Selection включен, вы можете установить режим выбора с помощью выпадающего меню Dimension. Доступны следующие опции:

Режим выбора	Описание
Show all	Диаграмма показывает выбранное измерение с его родительскими и дочерними элементами на всех уровнях выше и ниже.
Show selected and below	Диаграмма показывает выбранное измерение с его дочерними элементами на всех уровнях ниже.

Two sunburst charts with different selection modes enabled, a dimension at the second level of the hierarchy selected

Two sunburst charts with different selection modes enabled, a dimension at the third level of the hierarchy selected

Опция Enable drilldown доступна только тогда, когда Selection отключен. Вот как это работает: если вы нажмете на элемент, у которого есть дочерние элементы, вы перейдете на уровень ниже к нему и его дочерним элементам, а если нажмете на родительский элемент, вы перейдете на уровень выше.

A sunburst chart with drilldown enabled

Условия расчета

AnyChart поддерживает условия расчета: вы можете задать условие, которое должно быть выполнено (true), чтобы объект отобразился. Если условие не выполнено, отображается пользовательское сообщение.

Условие расчета полезно, когда диаграмма или таблица очень велики, из-за чего визуализация медленно реагирует. В этом случае условие расчета может помочь, например, не показывать объект до тех пор, пока пользователь не отфильтрует данные до более управляемого уровня, применив выборку.

Чтобы добавить условие, выполните следующее:

Перейдите в Add-ons > Data handling на панели свойств.
Введите выражение в поле ввода Calculation condition.
Введите строковое значение или строковое выражение в поле ввода Displayed message.

Например, следующее выражение позволяет показывать диаграмму только тогда, когда пользователь выбирает менее 20 штатов:

If(Count(State) < 20, 1, 0)

Если штатов слишком много, AnyChart выводит это сообщение:

'There are too many states (' & Count(State) & ').'

A sunburst chart with a calculation condition

Sunburst

Sunburst

Für diese Erweiterung ist noch keine Roadmap verfügbar.