Кольцевая диаграмма: создайте собственный визуальный элемент с помощью Charticulator

В этом руководстве показано, как создать визуализацию кольцевой диаграммы с помощью Charticulator . Это похоже на круговую диаграмму; разница в том, что кольцевая диаграмма представляет категории в виде дуг, а не срезов. Вы узнаете, как спроектировать и создать собственную кольцевую диаграмму для отчета о данных LuckyTemplates.

Оглавление

• Запуск Чартикулятора
• Создание кольцевой диаграммы
• Размещение кольцевой диаграммы в LuckyTemplates
• Заключение

Запуск Чартикулятора

Сначала создайте и экспортируйте набор данных в Charticulator. В этом примере используются данные «Регион» и «Количество жалоб» .

Затем щелкните многоточие таблицы и выберите «Экспорт данных».

После этого перейдите на сайт charticulator.com и нажмите Launch Charticulator . Найдите и откройте экспортированный набор данных.

После этого вы будете перенаправлены на холст Charticulator.

Создание кольцевой диаграммы

Поместите прямоугольник из Marks на холст Glyph.

Затем измените порядок стека на Y.

Поместите № жалоб по ширине полосы внутри глифа.

Измените порядок сортировки на убывающий, выбрав порядок сортировки No. Of Complaints . Затем вы увидите гистограмму, показывающую порядок убывания.

Чтобы создать форму пончика, перетащите Polar из Scaffolds на холст. Это изменяет гистограмму на полярные координаты.

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

Вы можете настроить дизайн диаграммы, отрегулировав окружность.

Если вы хотите добавить цвета пончикам, откройте атрибуты Shape1 и поместите область в раздел «Заливка».

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

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

Затем откройте атрибуты Text1 и поместите регион в раздел «Текст». Затем вы увидите метки на диаграмме.

Сопоставьте цвета меток с цветами диаграммы, поместив регион в раздел «Цвет» тех же атрибутов.

Теперь ваша кольцевая диаграмма будет выглядеть так.

Создайте еще один текст для отображения значений в пончиках. Перенесите текст на холст Glyph и поместите его рядом с меткой области. Затем откройте его атрибуты и поместите No. Of Complaints в раздел Text.

Удалите десятичные знаки в значениях, изменив .1 на .0 в разделе «Текст».

Вот как будет выглядеть кольцевая диаграмма.

Размещение кольцевой диаграммы в LuckyTemplates

Сохраните файл и экспортируйте его в пользовательский визуальный элемент LuckyTemplates . Снимите отметку с опций автоматической оси в настройках осей и масштабов , чтобы избежать каких-либо изменений осей при вызове перехода контекста фильтра. Затем введите визуальное имя и экспортируйте файл.

Откройте LuckyTemplates и импортируйте файл диаграммы. Щелкните многоточие под Визуализациями и выберите Импорт визуального элемента из файла .

Щелкните значок Charticulator с визуальным названием кольцевой диаграммы и заполните раздел «Поля» соответствующими данными. После этого вы увидите кольцевую диаграмму на панели инструментов.

Вы также можете создавать взаимодействия с другими диаграммами. В этом примере столбчатая диаграмма используется для вызова переходов контекста фильтра. Чтобы создать взаимодействия, перейдите на вкладку «Формат» и нажмите «Редактировать взаимодействия» . Затем выберите диаграммы, с которыми вы хотите взаимодействовать, и щелкните значок взаимодействия.

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

Заключение

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

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

Мудассир