5 заметок с тегом

Makeover

Перевёрстка данных о миграции

Росстат нарисовал такое:

Округи можно вывести списком, не обязательно привязывать к карте. Стрелки всё окончательно запутывают: почему они делятся на сегменты? Важен ли их цвет? Куда уехало больше всего жителей ЦФО? Какой процент людей уезжает?

Было бы круче показать таблицей. В строках — откуда, в столбцах — куда уезжают. В исходной визуализации такой инфы нет.

Нажожу исходные данные на сайте Росстата. Да они прекрасны, всё как я и хотел :—) Даже больше: тут инфа разбита на городские и сельские поселения. По каждому федеральному округу можно посмотреть, сколько человек переехало из сёл в города, а сколько из городов в сёла.

Попробую для начала визуализировать в Табло. Сейчас данные в виде разреженной таблицы, надо сделать её плотной. То есть такой, чтобы в каждой строке было указано: из какого ФО, из города или из села, сколько человек переехало, в какой ФО, в город или в село. Часть работы делаю вручную:

Выделенными данными надо заполнить столбцы to_district и amount. Тогда в каждой строке будет по одному числовому значению, как нам и надо. Вручную делать это долго, к счастью, Табло умеет так:

Ррраз — и данные в правильном формате:

Здорово. Попробуем визуализировать:

Теперь посмотрим миграцию между сёлами и городами:

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

Уберём переезды внутри своего ФО, чтобы внимательнее рассмотреть остальные:

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

В данных Росстата есть информация за несколько лет, почему бы не показать динамику изменения миграции? Перевожу остаток данных Росстата в нужный формат при помощи Vim и Табло, рисую гарфики:

Площадь графика показывает число переездов за все годы. Видим, что в 11 году все дружно начали переезжать
Если оставить только переезды в другие регионы, будет так

Между делом показываю результат Роме Бунину, он предлагает попробовать санки чарт. И показать всё-таки карту России. Пробую санки:

Справа порядок неправильный, не стал пока исправлять

Слева — сколько уехало из округа, справа — сколько приехало. Клёво, что все потоки видны и что они похожи именно на потоки. Если с таблицей надо разбираться, тут сразу видно, что что-то куда-то перетекает. А если не повторять каждый регион по два раза? Пробую вариант с chord diagram, которую собираю в онлайн-генераторе:

Даже если не обращать внимания на весь обвес, стало слишком сложно. В середине каша. А ещё в подобных диаграммах потоки в середине становятся тоньше. Такое решение улучшает читаемость, но искажает данные.

Тупик. Запоздало иду искать аналогичные визуализации.

Красиво, но если показать миграции между всеми штатами, будет каша

Плюс много санки и chord:

Делаю десяток набросков, в голову приходит странный вариант: а что, если сделать аналог плиточной карты для округов? Прототипирую в табло:

«Карта» состоит из восьми клеток-округов. Внутри каждого округа — такая же карта округов. Чтобы узнать, из какого округа чаще всего переезжают в ЦФО, надо выбрать в клетке ЦФО самый большой кружок. И посмотреть, какой округ он означает. Переезды внутри региона показываю серыми кружками.

Экспортирую из Табло ПДФ и допиливаю в Скетче:

Показываю Андрею Ересу. Оказывается, ничего не понятно, надо было раньше показать :—\

Решаю вернуться к старой версии с таблицей. Пробую импортнуть ПДФ из Табло в Скетч, но всё очень тормозит. Поэтому визуализирую на d3, дорабатываю в Скетче:

Доработать не успеваю, решаю на этом закончить. Клёво было бы ещё показать численность населения округов и её прирост.

2018   Makeover   Перевёрстка

Перевёрстка тарифов 246 маршрутки

Мы тут с Андреем Ересом пробуем вести канал в телеграме. Перевёрстываем разные штуки, постим результат и процесс.

На этой неделе улучшали красоту:

Никогда не понимал таких бумажек. Сколько, например, стоит проехать от ПМК до Новенького? В каком порядке идут остановки? Попробовал сменить формат. Процесс:

Результат:

Сразу видно, что от ПМК до Новенького цена не предусмотрена, надо торговаться с водителем. Но в любом случае, не дороже 33 ₽.

Опубликовал в телеграме а потом понял, что полосочки можно ещё плотнее утрясти:

У такого варианта большой косяк: чтобы убедиться в правильности цены, надо весь лист обежать глазами. Тут надо помнить, что лист висит на стене и пальцем по нему водить не всегда получится. Например, чтобы узнать стоимость проезда от Современника до Средней Ахтубы, надо глазами проделать вот такой путь:

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

Пожалуй, так лучше. Глаз быстрее находит линию, соединяющую две нужные остановки.

Пробую вариант с треугольной таблицей. Где не хватает цен — додумываю.

Но это, конечно, жесть: надо инструкцию рядом вешать, как цену определять. Чтобы сделать формат понятнее, придётся дублировать информацию. Раз уж у нас в итоге получилась скучная таблица, добавим немного визуализации:

Знаете, как сделать лучше? Присылайте свой вариант мне в телеграм: @ivan_dianov. Опубликуем и прокомментируем его в канале «Перевёрстка».

2018   Makeover

Производство и экспорт машин в Германии

Германская ассоциация автомобилестроения опубликовала данные о производстве и экспорте легковых автомобилей и фур.

Такая визуализация прячет данные:

  • В статье два графика: один про экспорт, другой про импорт. Они живут в разных шкалах и не влезают в один экран, поэтому сравнивать их неудобно.
  • Чтобы посмотреть данные по фурам, надо нажать кнопку-переключатель.
  • Приходится скроллить вправо-влево, чтобы что-то увидеть.
  • Ось Y начинается не с 0 а с 10 000, что усложняет понимание.

Я сделал свою версию. Данных не так много, поэтому показал их все сразу:

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

Теперь не нужно рисовать тренд, его и так видно. Например, видим спад производства в конце кризисного 2008 года.

Было бы интересно добавить информацию о производителях: кто в каком году сколько машин произвёл, кто недавно вышел на рынок.

Визуализация о британском искусстве

Галерея Тейт — самое крупное собрание британского искусства. Она открылась в 1500 году и сейчас хранит 30 000 художественных работ: рисунки, картины, скульптуры, фотографии, инсталляции. Данные об её экспонатах лежат на гитхабе.

Florian Kräutli визуализировал их вот так:

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

Первый график смотрится клёво. Мне не нравится, что вертикальное положение кружков ничего не значит. Цвет не используется, можно было им показать, например, технику.

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

В каком году галерея приобрела больше всего работ этого художника?

Я поменял формат графика и добавил полезной информации: показал сколько лет каждая картина ждала попадания в музей:

Каждая полоска — картина. Левый конец показывает год создания, правый — приобритения музеем. Чем длинее полоска, тем дольше работа ждала своего часа. Картины одного художника стоят рядом, раскрашены одинаково, отсортированы по году создания.

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

Первые пять лет Энди Уорхол творит с постоянной скоростью. В 1965 году затишье. Последние несколько лет скорость растёт.

По правому краю видно, что музей получил большую часть работ в 2008 и 2009 годах.

Последние две картины галерея приобела в 2016. Вот одна из них:

Алекс Кац, Полнолуние, 1988

Как и автор исходной визуализации, я убрал из данных сверхпродуктивного Уильяма Тёрнера. С ним было бы так:

Уильям Тёрнер нарисовал большую часть галереи Тейт

Мейковер мандей

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

На этой неделе — статья The National Parks Have Never Been More Popular. В ней Эндрю Флауэрс показывает рост посещаемости национальных парков Америки:

Нравится, что нет легенды, подписи прямо на графиках.

Не нравится:

  • Линейные диаграммы обманывают: кажется, что значения между точками имеют смысл. Верхний график говорит, что первого июля двухтысячного года в парках побывало 430 миллионов человек. На самом деле эта цифра за год.
  • Рейтинг на втором графике ничего не говорит о посещаемости. Если парк поднялся на одно место, посещаемость могла вырасти на одного человека, или на миллион, или уменьшиться в два раза.

Скачал исходные данные и визуализировал их в Табло. Инструмент знаю плохо, поэтому за красотой не гнался. Цель — показать, за счёт каких парков выросла общая посещаемость.

Не до конца разобрался в терминах. Кажется, recreation visitors — с палатками, non-recreation — без.

Общая посещаемость:

Посещаемость отдельных парков:

Обрезал высокое изображение, полная версия на Табло

Стало видно, посещаемость растёт у разных парков понемножку.

Ещё вылезли артефакты. George Washington MEM P в 1993 году оккупировали «беспалаточные» туристы. А «палаточных» как будто перестали пускать вовсе:

National Capital Parks Combined в 1996 тоже странно ведут себя. Название намекает, что это не парк а сумма посещаемостей других парков.

2017   Makeover