Як я візуалізувала дані повітряних тривог і що з цього вийшло

На другу річницю широкомасштабного вторгнення мені спало на думку візуалізувати дані повітряних тривог в Україні. Оскільки, як мені здається, в інфопросторі доволі мало саме якісної інфографіки, орієнтованої на англомовного читача, присвяченої війні в України. Вибір інструмента для візуалізації пав на Tableau. З цим софтом я працювала останні кілька років, і мені завжди кортіло показати певні особливості роботи з ним, адже це доволі зручне програмне середовище, в якому можна розповісти певну інтерактивну історію.

Невелика історична довідка. Компанія була заснована у 2003 році двома студентами Стенфордського університету, софт мав доволі стрімкий розвиток спричинений попитом на BI рішення в цілому, а в 2017 році її акції придбав Salesforce. Після цього компанія продовжила розвиватися як окремий бренд, маючи при всьому тому глибоку інтеграцію з екосистемою Salesforce. З недавніх нововведень була інтеграція з AI — Tableau Pulse з можливістю генерації контекстних інсайтів щодо ключових метрик для бізнес-користувачів.

Найближчими до Tableau BI рішеннями, якщо зважати на функціонал і цінову політику, вважають Power Bi та QlikSence.

Багато в чому ці інструменти є взаємозамінними. Кілька разів мені прилітали клієнтські запити переробити PowerBi візуалізацію в Tableau середовищі, або з Tableau в PowerBi. Але не хочу бути, власне, євангелістом жодної з платформ. Зазначу лише, що найбільш гнучким у виборі дизайн-рішень та графіків я вважаю саме Tableau через те, що абсолютно все вирішується за допомогою Columns & Rows підходу. Він дозволяє намалювати будь-яку функцію виду Y=F(x), де Y відображається по вісі Column, а X по вісі Rows, а отже будь-якої складності криву. Як то кажеться, The Sky is the Limit.

Отже, на вході маємо готовий датасет зі статистикою повітряних тривог, яким любʼязно поділились волонтери єТривоги. Одразу зазначу, що опублікувати дашборд на хостинговій платформі Tableau Public можна лише на csv або excel датасеті. Life connection можливий, але він передбачає платну версію та хостинг на Tableau Online або Tableau Server.

Ключові Кроки

Загалом будь-яку роботу над дашбордом можна умовно розбити на декілька кроків.

1.Планування. Продумування концептуального наповнення дашборду, розуміння, на які запитання ми хочемо відповісти, або яку проблематику підсвітити. В корпоративному середовищі це передбачає тісну співпрацю з продакт-оунером, проджект-менеджером або аналітиком.

2.Розробка прототипу. Розробка Dashboard Wireframe — візуального прототипу, UI/UX, створення ключових візуальних елементів. Для тих хто хоче заглибитися в тему візуалізації даних залишу лінк на Nightingale, медіа де багато таких матеріалів та інструкцію.

Для розробки візуального прототипу мені найбільш підходить Figma. Одним з основних моментів при конструюванні дашборду я вважаю мінімізацію візуального шуму. Принцип data-to-ink ratio, сформульований Едвардом Тьюфтом, саме має на меті мінімізувати використання «чорних» або неважливих елементів в графічному представленні даних, зберігаючи при цьому максимальну інформативність. Іншими словами, кожен використаний елемент малюнка (інк) повинен нести значущу інформацію (дані). Наприклад, якщо ми розглядаємо графік, виконаний з великою кількістю непотрібних ліній або зайвих візуальних елементів, це порушує принцип data-to-ink ratio.

3.Розробка. У висхідному датасеті маємо дані початку і кінця кожної тривоги з прив’язкою до області та координат обласного центру.

Побудова гексагон мапи України. Чому саме вона? Така мапа стає в пригоді, коли ми прагнемо до певної однорідності у сприйнятті інформації, хочемо розуміти певні закономірності по регіонах, але можемо відкинути територіальні кордони, оскільки вони можуть викривляти загальне сприйняття. Подібний підхід дуже часто використовують для створення карт результатів виборів у Сполучених Штатах.

Створюємо параметр Adjuster. Використовуємо Adjuster для того, щоб прив’язати до карти оптимальну кількість гексагонів, яка нам потрібна.

Калькуляції. HEXBINX: (HEXBINX([longitude]*Adjuster, [latitude] *Adjuster)/Adjuster). HEXBINY: (HEXBINY([longitude]*Adjuster, [latitude] *Adjuster)/Adjuster).

HEXBINX та HEXBINY обчислює значення центроїду кожного шестикутника. Кожна з цих функцій приймає довготу та широту як вхідні дані, і в кінцевому підсумку ми отримуємо значення X та Y шестикутників. Задаємо географічну роль для HEXBINX. Geographic role → Longitude. Задаємо географічну роль для HEXBIN Y. Geographic role → Latitude

Погнали!Візуалізуємо.

Переносимо HEXBIN X на Columns, a HEXBIN Y на Rows. На виході отримуємо шестикутники, прив’язані до координат обласних центрів.

Знімаємо геоприв’язку, а отже зʼявляються вісі. У ручному режимі я дещо редагую координати для того, щоб відстані між шестикутниками виглядали однаково.

Калькуляція типу наповнення гексагону для позначення % днів з тривогою:

if [% days with raids]<0.1 then ’0′ ELSEIF [% days with raids]<=0.5 AND [% days with raids]>0.4 then ’1′ ELSEIF [% days with raids]>0.5 and [% days with raids]<=0.6 then ’2’ELSEIF [% days with raids]>0.6 and [% days with raids]<=0.7 then ’3′ ELSEIF [% days with raids]>0.7 and [% days with raids]<=0.8 then ’4′ ELSEIF [% days with raids]>0.8 and [% days with raids]<=0.9 then ’5’ELSEIF [% days with raids]>0.9 and [% days with raids]<=0.97 then ’6′ ELSEIF [% days with raids]>0.97 then ’7′ END

Нам залишилось лише створити іконки з різними типами гексагонів відповідно до заданої метрики.

Побудова радіальних чартів. Кількість повітряних тривог, які розпочались в певному часовому проміжку відкладається відносно кожної з 24 годин. Для того щоб намалювати радіальний чарт, потрібно мати стартову точку і кінцеву. Для цього нам знадобиться операція Union висхідного датасету на самого себе.

Для того, щоб зробити такий чарт, нам потрібні кілька параметрів та калькуляцій.

Параметр Adjuster

Параметри Radial Inner та Radial Outer. Обидва параметри дозволяють контролювати розмір кола в центрі кожного чарту

Radial field: ABS([Count of days])

Angle: ([index]-[Adjuster])*(1/WINDOW_COUNT([radial field]))*2*PI()

Length: [radial inner]+IIF(ATTR([Table Name])=’alarms-700days-all-regions-and-kyiv.csv1’,0,[radial field]/WINDOW_MAX([radial field])*([radial outer]-[radial inner]))

де Alarms-700days-all-regions-and-kyiv.csv1 — це назва нашого датасету

Radial X: -[length max]*COS([angle])

Radial Y: [length max]*SIN([angle])

Візуалізуємо!

Пересуваємо Radial X на Columns, Radial Y на Rows. Переносимо калькуляції на Marks Shelf

Нам потрібно відобразити кількість повітряних тривог, залежно від часового проміжку, кожен відрізок репрезентує одну годину з 24-х. Змінюємо тип мітки з автоматичної на лінійну. Змінюємо тип Table name на Path.

Створюємо табличну калькуляцію з Radial X. Compute using Time Hour. Створюємо табличну калькуляцію з Radial Y. Compute using Time Hour. Міняємо стартове положення відліку годин за допомогою параметра Adjuster так, щоб 24:00 було у верхньому положенні.

На виході маємо радіальний чарт.

Нам залишається завершити реалізацію нашої інтерактивної історії, а саме:

• зробити основні метрики та лінію тренду,
• зшити все це у один дешборд,
• додати інтерактивність за допомогою SetActions.

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

Фінальний результат >>> лінк

Я залишаю відкритою можливість завантажити дашборд для того, щоб вивчати «внутрянку», кому цікаво.

Як висновок зазначу такі важливі моменти:

Можливість безкоштовного користування. У Tableau існує кілька можливостей спробувати софт безкоштовно, окрім, власне, тріальних 14-денних версій:

• Tableau Public: безкоштовна версія, яка дозволяє створювати та публікувати візуалізації. Дані, які ви використовуєте, повинні бути збережені у хмарі Tableau Public, а дашборди будуть доступні всім в інтернеті.
• Tableau для студентів: безкоштовні ліцензії студентам і викладачам акредитованих навчальних закладів протягом одного року.
• Tableau Public Desktop: безкоштовна версія, яка дозволяє створювати візуалізації та панелі управління. Однак, подібно до Tableau Public, ваші дані повинні бути збережені у хмарі Tableau Public, і ваші роботи будуть доступні публічно.

Обмежений ETL. Обмежені можливості, коли йдеться про моделювання даних та ETL. Реліз Tableau Data Prep Builder навесні 2018 року було анонсовано як певний ETL інструмент, де можна почати робити перетворення і трансформації датасету. Згодом на сцені вийшов Tableau Prep Conductor, що мав розширені можливості щодо управління, моніторингу та секʼюрності перетворень в середовищі Tableau серверу. Водночас цінник за такі надбудови не є завжди прийнятним для компаній. Тому доволі розповсюдженим є кейс, коли весь цикл трансформацій обмежують певним додатковим ETL інструментом, як, наприклад, Matillion, Databricks aбо Alteryx, як то було у командах, де я працювала.

Спільнота, навчання, обміни досвідом. Варто відзначити, що Tableau має широку спільноту для обміну знаннями та кращими практиками. На сьогодні нараховується близько 3 мільйонів людей, що мають своє портфоліо на Tableau Public. Крім, власне, аудиторії, існує онлайн галерея Tableau, де можна отримати багато натхнення з використання кращих практик.

Ініціатива Візуалізація дня /Viz-of-the-Day/. Кожного дня обирається Візуалізація дня, яка поширюється на кількамільйонну аудиторію.

👉 Для того, щоб максимальна кількість людей переглянула дашборд про ситуацію в Україні, прошу підтримати його в номінації Візуалізація дня, натиснувши на верхню праву іконку на панелі Tableau Public дашборду — Nominate for Viz of the Day.

Дякую всім, хто дочитав до цього моменту. 🙂 Також я завжди відкрита для ідей щодо покращення, конструктивної критики і колаборацій. У статті використані підходи для створення візуалізацій від Andy Kriebel.

Підписуйтеся на Telegram-канал «DOU #tech», щоб не пропустити нові технічні статті