Черновик статьи на хабр

[illus0r]

Черновик статьи на хабр.

Станислав Дробышевский в начале года опубликовал подробное дерево происхождения приматов.

ПДФ

Комментаторы во «Вконтакте» просили интерактивную версию, некоторые были готовы помочь с реализацией. Интерактивную схему удобнее изучать и проще обновлять при появлении новых данных.

Мы с Олей решили помочь палеоприматологии и сделали прототип на d3js.

Расскажу, как шла работа, и какие приёмы нам помогли.

Цель

Первая мысль — сделать научно-популярную схему, более продвинутую версию известной картинки:

Но про это уже есть отличный проект Глеба Крауклиша.

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

Дизайн

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

Ещё хочется нагляднее показать иерархию таксонов (групп организмов).

Делаю первый эскиз:

Сразу же появляются вопросы. Например: «А не должны ли родственные связи как-то зависеть от вложенности таксонов?» Приходится закопаться в Википедию, узнать, про кладистику и монофилию. У Станислава узнаю, что никакой кладистики на схеме нет, а значит дерево родственных связей не обязано совпадать со вложенностью таксонов.

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

База данных

Проект хостится на Github pages. Изначально мы хотели готовить данные в гуглотаблице, потом конвертировать их в csv и коммитить его на гитхаб. В итоге решили грузить данные напрямую из гуглотаблицы.

Плюсы такого решения:

• Станислав Дробышевский сможет без нашей помощи менять данные.
• В процессе разработки нужно было часто исправлять ошибки, пробовать разный порядок данных. Гуглотаблица сэкономила нам кучу времени.

Минусы:

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

Копирование данных

На помощь пришла Лёля Колесникова она скопировала данные из ПДФ в таблицу на 300 строк. Конечно, хотелось как-то автоматизировать процесс, но было затруднительно. Некоторые нюансы были неочевидны даже при ручном переносе.

Главная сложность — глубокая вложенность таксонов. Вот список всех рангов:

1. mirorder
2. order
3. suborder
4. infraorder
5. parvorder
6. superfamily
7. family
8. subfamily
9. genus

Для упрощения копирования данных и их проверки, нарисовал поверх схемы цветные плашки. Цвет означает ранг таксона, названия подписаны сверху.

Полная версия

Нашёл пропущенный ранг, исправил его на цветной схеме.

Иллюстрации

Картинки помогают разнообразить однообразное полотно и помогут примерно представить, на что похожи представители таксонов. Зовём в проект иллюстратора. Татьяна Сергеевна берётся за дело.

Обсуждаем референсы:

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

Проверка данных

При переносе из ПДФ в данные закрались ошибки. Поэтому, прежде чем показывать схему Станиславу, проверяем сами.

1. Каждая страна должна относиться только к одному из материков. Проверяю это соответствие сводной табличкой

.

4. Чтобы проще было проверять периоды, пишу мини-скрипт на d3, который подписывает начало и конец периодов прямо на графике. Надо было с самого начала так сделать.

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

Картинки грузятся с http://avatars.adorable.io/

Сложности

По ходу работы всплывают интересные проблемы, обсуждаем их со Станиславом.

Например, некоторые таксоны происходят от более поздних. Например, Amphipithecidae → Oligopithecinae → Perupithecus ucayaliensis. Разумеется, это невозможно, просто более ранние представители Amphipithecidae и Oligopithecinae пока не найдены. Решаем искусственно наращивать родительский таксон в прошлое:

Поначалу мы думали, что связи возможны только между «кирпичиками», но потом оказалось, что нужна возможность соединеня любых таксонов: и «кирпичей» и «рамочек». Приходится пока что убрать проблемные связи (от инфраотряда EOSIMIIFORMES)

Иногда всплывают интересности:

На будущее

• Задача максимум — сделать базу археологических находок и показать их на этой схеме. Сейчас непонятно, откуда взялись все эти полосочи, какие археологические находки за ними стоят.
• Добавить возможность связи между таксонами любого ранга. Сейчас только кирпичи между собой можно соединять. Поэтому мы не можем показать связь с исходной схемы EOSIMIIFORMES → Amphipithecidae
• Показывать места археологических находок прямо на карте.
• Земля за 65 миллионов лет сильно поменялась. Было бы классно менять её форму при горизонтальном движении курсора.
• Можно названия таксонов аккуратно собрать в левой части, как на таблице у Тафти.
• При клике на таксоне показывать подробную информацию о нём.
• У антропологов нет единого взгляда на эволюцию. Хочется в будущем визуализировать эту неопределённость и увидеть, с чем все согласны, а в чём мнения расходятся.

Если у вас есть интересные данные и их надо проанализировать или визуализировать — пишите, будем рады сотрудничеству.
ivan@dianov.org, телеграм: @ivan_dianov.

[illus0r]

@MainOlma

[illus0r]

2018.10.02-13.33.35.pdf
Ссылка на ПДФ для статьи на хабр. Не придумал, куда ещё залить.