Maps-flows
Показываем наш опыт интерактивной визуализации транспортных потоков на картах в браузере. Подобный тип представления данных — довольно классический и широко распространен: и в веб-приложениях, и в статических инфографических рендерах. Мы изучили много материалов, чтобы понять, какие места можно сделать интереснее, и вот что получилось.
В первую очередь мы поработали над ландшафтами: реализовали рельеф с помощью parallax mapping и добавили кучу настраиваемых параметров к нему. Да и вообще сделали, чтобы дороги и все линии к этому рельефу самым правильным образом адаптировались.
Не смогли без супердотошности: когда камера из одного региона переходит в другой — свет вращением переходит в другую позицию. Грубо говоря, свет пытается расположиться спереди от смотрящего, так чтобы лучи, падающие на поверхность, отражались под большим углом — так поверхность и тексты лучше всего выглядят.
Далее мы проанализировали все найденные реализации арок и сделали возможность настроить абсолютно любую их форму и внешний вид: от канонических-правильных, до специфических-необычных.
Можно настроить свои арки, либо использовать пресеты.
Геометрия арок, ширина, настройки градиентов, настройки мест стыка арок с поверхностью, визуальная зависимость от величины потока, настройки интерактивности — абсолютно все доступно через API.
Визуализация потоков не совсем полноценна без анимированной системы частиц, поэтому мы реализовали большой функционал их настройки: от классических сфер/кубов, до кастомных мешей: корабликов, грузовиков, самолетов.
Большой набор параметров потоков частиц позволяет настроить сцену либо художественнее и инфографичнее, либо получить самую классическую классику. Тут уж кому в какой контекст нужно интегрироваться.