ДЕНЬ 15
Про спарклайны
СЕГОДНЯ
Разбираемся со спарклайнами и барлайнами. Учимся показывать тенденции, не занимая при этом много места. Ознакомимся с историей изобретения. Посмотрим на примеры применения спарклайнов в разных областях - от астрофизики до финотчетов компаний. Ну и как всегда - вдохновение через выступления дата-артистов, книга на ночь и практика для закрепления навыка в Tableau.
Разбираемся со спарклайнами и барлайнами. Учимся показывать тенденции, не занимая при этом много места. Ознакомимся с историей изобретения. Посмотрим на примеры применения спарклайнов в разных областях - от астрофизики до финотчетов компаний. Ну и как всегда - вдохновение через выступления дата-артистов, книга на ночь и практика для закрепления навыка в Tableau.
РАЗБИРАЕМСЯ
Спарклайны / Sparklines
Что это такое
Спарклайн (от англ. spark – искра) – миниатюрная, компактная диаграмма, в которой нет подписей данных, шкал, названий категорий, аннотаций. Они показывают динамику изменения показателя на отрезке времени. Спарклайны обычно иллюстрируют данные в таблице (располагаются рядом), показывая тренд и наглядную историю значений. В отличие от обычного графика, который нацелен показать максимум данных, спарклайны - нацелены на то, чтобы показать самое основное и скорее быть дополнением.
Спарклайном может быть и линейный график, и столбиковая диаграмма. Главная фишка спарклайнов – это правильное форматирование: уберите подписи осей и точек, сделайте линии тонкими и простыми, не показывайте размерность шкалы.
Поставьте спарклайны на одном уровне с нужной таблицей и получите краткую визуализацию большого количества цифр в компактном виде.
Спарклайном может быть и линейный график, и столбиковая диаграмма. Главная фишка спарклайнов – это правильное форматирование: уберите подписи осей и точек, сделайте линии тонкими и простыми, не показывайте размерность шкалы.
Поставьте спарклайны на одном уровне с нужной таблицей и получите краткую визуализацию большого количества цифр в компактном виде.
Как построить
Этап 1. Создание
1. Добавьте поле с датой в Columns, выбрав Continuous формат даты
Пилюля должны быть зеленого цвета
2. Добавьте нужную категорию в Rows
3. Добавьте нужную меру в Rows
4. Зайдите в настройки оси - нажмите правой кнопкой по шкале - и снимите галочку с бокса Include Zero
Тем самым, вы исключите отображение всей оси с нуля: это уберет лишнее место под графиком
5. В том же меню, выберите Independent axis range for each row or column (Независимые оси)
Этим шагом вы сделаете оси независимыми для каждого значения вашей категории
6. Скройте заголовки осей для меры и даты, оставив только подписи категории
По сути, вы создали обычный график - лишь сделали пару настроек у осей. Главное - его дальше хорошо отформатировать.
Этап 2. Форматирование
1. Измените размер и сделайте спарклайны компактными
2. Уменьшите толщину спарклайнов (через Size)
3. Добавьте и настройте тултипы (через Tooltips)
4. Уберите границы, рамки, нулевые линии (zero lines), и сетку на фоне
Подробнее тут →
1. Добавьте поле с датой в Columns, выбрав Continuous формат даты
Пилюля должны быть зеленого цвета
2. Добавьте нужную категорию в Rows
3. Добавьте нужную меру в Rows
4. Зайдите в настройки оси - нажмите правой кнопкой по шкале - и снимите галочку с бокса Include Zero
Тем самым, вы исключите отображение всей оси с нуля: это уберет лишнее место под графиком
5. В том же меню, выберите Independent axis range for each row or column (Независимые оси)
Этим шагом вы сделаете оси независимыми для каждого значения вашей категории
6. Скройте заголовки осей для меры и даты, оставив только подписи категории
По сути, вы создали обычный график - лишь сделали пару настроек у осей. Главное - его дальше хорошо отформатировать.
Этап 2. Форматирование
1. Измените размер и сделайте спарклайны компактными
2. Уменьшите толщину спарклайнов (через Size)
3. Добавьте и настройте тултипы (через Tooltips)
4. Уберите границы, рамки, нулевые линии (zero lines), и сетку на фоне
Подробнее тут →
Виды спарклайнов
Спарклайн может быть не только линейным графиком, но еще и показывать столбики, как бар-чарт.
При этом, можно показывать как абсолютные значения, так и отклонения. Можно выделять столбики цветом или оставить единый цвет для всего графика. Можно выделять каждую точку на графике, а можно не выделять никакую.
Спарклайн может быть не только линейным графиком, но еще и показывать столбики, как бар-чарт.
При этом, можно показывать как абсолютные значения, так и отклонения. Можно выделять столбики цветом или оставить единый цвет для всего графика. Можно выделять каждую точку на графике, а можно не выделять никакую.
СОВЕТ
Отмечайте контрастными точками минимальные/максимальные значения, или самые первые/последние значения. Для отмеченных двух точек можно вывести подписи данных.
Точки как маркеры минимальных и максимальных значений
История создания
Спарклайн был придуман в 1983 году Эдвардом Тафти - гуру визуализации данных, чьи книжки мы рекомендовали вам к прочтению.
В начале своей карьеры, Тафти никак не был связан с той областью, в которой он затем прославился - с визуализацией информации. Он закончил Стэнфордский университет, где получил степень бакалавра, а затем и магистра по статистике. В 1975 году он был приглашен преподавателем статистики для группы журналистов. Для них он разработал курс лекций по статистическим графикам. Материалы этого курса потом легли в основу его первой книги по информационному дизайну. Книга "Визуальное представление больших объемов информации" уже считается классикой. Издание книги в 1982 году Тафти профинансировал самостоятельно, взяв вторую закладную на дом.
В начале своей карьеры, Тафти никак не был связан с той областью, в которой он затем прославился - с визуализацией информации. Он закончил Стэнфордский университет, где получил степень бакалавра, а затем и магистра по статистике. В 1975 году он был приглашен преподавателем статистики для группы журналистов. Для них он разработал курс лекций по статистическим графикам. Материалы этого курса потом легли в основу его первой книги по информационному дизайну. Книга "Визуальное представление больших объемов информации" уже считается классикой. Издание книги в 1982 году Тафти профинансировал самостоятельно, взяв вторую закладную на дом.
Эдвард Тафти
Изначально графики, похожие на спарклайны, использовали в медицине и науке. При помощи простых линий показывали, например, ритм биения сердца или звуковые волны. В 1970 году NASA опубликовало отчет о проблемах в лунном модуле Apollo, в котором была вот такая страничка:
Эдвард Тафти популяризировал эти графики - сейчас их используют не только в астрофизике, но и в финансовых отчетах в обычных компаниях.
Примеры
Посмотрев на прикладные примеры, ниже подборка примеров в визуализациях на дашбордах и отчетах.
СОВЕТ
Не нужно делать спарклайны слишком высокими или слишком широкими. Должно сохраняться оптимальное соотношение сторон.
Идеальное соотношение сторон
Еще раз о самом главном в спарклайнах: правильное форматирование!
ПРАКТИКУЕМСЯ
Сегодня практикуемся в создании небольших графиков и их правильном форматировании. Убрать лишние подписи, показать число только за последний период, подобрать правильные контрастные цвета, настроить фоновые линии. И все это на интересном датасете!
Датасет
Статистика по продажам стандартного и премиального виски с 1990 по 2016 год по странам мира.
Скачать датасет
Скачать датасет
Задание
1. Построить спарклайн-графики продаж виски по выбранным странам за период с 1990 по 2016.
2. Сделать перевод графика из варианта 1 в вариант 2
3. Разместить решение на дашборде.
Скачать задание в виде книжки Tableau
2. Сделать перевод графика из варианта 1 в вариант 2
3. Разместить решение на дашборде.
Скачать задание в виде книжки Tableau
Решение задания предыдущего дня
Лучше принять приблизительно верное решение, чем точно ошибиться.
Иоганн Вольфганг Гёте
Иоганн Вольфганг Гёте
ВДОХНОВЕНИЕ
Полезные ссылки по теме
Сегодня пара практических ссылок по теме спарклайнов и интереснейшая работа немецких коллег по микровизуализации. Изучать внимательно.
О дизайне спарклайнов и как делать их действенными
О том как совмещать показатели и парклайны на одном графике
Шикарная работа с большим количеством идей для смешанной графики
Видео
Продолжаем тему дизайна и сегодня вдохновимся неизменными принципами вместе с Россом.
Гармоничный дизайн, вдохновлённый природой
Росс Лавгроув
МАТЕРИАЛЫ
Книги
Потрясающий сборник работ по информационному дизайну целого коллектива именитых авторов. Ознакомиться обязательно.
Отличная возможность поиграться с выбором диаграмм
Можно оценить спектр инструментов визуализации под специфические задачи
Итоги этапа
Вот и добежали по приблизительному спарклайн маршруту до конца дня. Натренировались строить быстро спарклайны, рассмотрели тенденции продаж виски, не попробовав ни грамма, советы взяли себе для проектов. Скорее всего застряли на микровизуализации и выборе визов на чартмейкере Энди Кирка (уважаемом фрилансере, как его называют коллеги из Минска). Вполне возможно уснули на листании Информационного дизайна, что тоже неплохо, можно продолжить будет утром на следующий день, встретив потрясающе красивую тему нового дня - множественные графики. До встречи! Приятного изучения. Виз виз урааа!
~
