Тема: Инструменты 4

Первые шаги в мир визуализации могут быть по-настоящему сложными. Что нужно знать с самого начала?

В статье использованы интервью с экспертами по визуализации данных Moritz Stefaner, Scott Murray, Benjamin Wiederkehr, с партнёром студии Interactive Things в сфере дизайна и технологий и экспертом в области инфографики Jan Willem Tulp, а также с программистом-дизайнером Erik Cunningham.

Количество доступных на сегодня источников данных и инструментов для их обработки само по себе уже наглядно показывает, что ещё никогда столько людей не пыталось освоиться в мире визуализации данных. А когда есть такое число материалов, доступных к изучению, один только вопрос «С чего начать?» может напугать каждого новичка. Итак, какие же библиотеки являются лучшими и что советуют профессионалы? Об этом и пойдёт речь в данной статье.

D3

Говорить о визуализации данных и не упомянуть D3 – это всё равно, что рассказывать об истории создания персональных компьютеров и ни словом не обмолвиться о Стиве Джобсе. D3 (от англ. Data Driven Documents) – это без преувеличения самая важная и доминирующая на рынке JavaScript библиотека с открытым исходным кодом, которая обычно используется для создания SVG-графиков. SVG (от англ. Scalable Vector Graphics) – это в свою очередь формат векторного изображения, поддерживаемый веб-браузерами, но ранее мало использовавшийся.

Библиотека D3 во многом обязана своей популярностью внезапному интересу к SVG со стороны веб-дизайнеров, что в значительной степени объясняется тем, как выигрышно векторные графики выглядят на экранах с большим разрешением (в частности, на Retina-дисплеях, используемых в устройствах Apple), которые становятся всё более распространёнными.

«Будем честными, если задача состоит в визуализации данных на основе SVG, то для её решения все остальные библиотеки даже рядом не стояли», – говорит Moritz Stefaner, независимый эксперт в области визуализации данных и владелец компании Truth & Beauty. «Есть также немало интересных проектов, созданных на базе D3, как, например, NVD3, который предоставляет стандартные графические компоненты – готовые к использованию, но кастомизируемые; или, скажем, Crossfilter – просто выдающийся инструмент для фильтрации данных».

Scott Murray, программист-дизайнер и автор книги Interactive Data Visualization for the Web, согласен с предыдущим мнением: «D3 обладает чрезвычайной силой, которая заключается в том, что в нём используется всё, что только могут предложить браузеры. Хотя у этого есть и обратная сторона: если браузер не поддерживает что-то, например, 3D-изображения на основе WebGL (от англ. Web Graphics Library), то и D3 это поддерживать не будет».

И хотя эта библиотека по-настоящему универсальна, она всё же не является идеальным решением для любой задачи. «Основной недостаток библиотеки D3, если можно так выразиться, состоит в том, что она не предписывает и даже не предлагает какого-то определённого подхода к визуализации», – добавляет Scott Murray. «То есть это действительно инструмент для загрузки данных в браузер с последующей генерацией DOM-компонентов на основе этих данных».

Vega

В то время как D3 представляет собой отличный инструментарий для кастомных изображений, если вы хотите создать стандартный график без особой проработки визуального аспекта, то вам может быть полезен такой инструмент как Vega. Будучи фреймворком, разработанным на базе D3, Vega предоставляет альтернативу для отображения графических компонентов. Используя Vega, можно визуализировать данные в формате JSON вместо написания D3/JavaScript кода, а затем генерировать интерактивные изображения с использованием HTML5 Canvas или SVG. Это значительно упрощает программную часть и экономит время (если, конечно, это вообще ваша зона ответственности). А кроме того, повышается возможность взаимо- и переиспользования проектов визуализации, при этом позитивно влияя на гибкость платформы.  Продолжить чтение →