📈 Grammar of graphics in a nutshell 📖 Вас когда-нибудь интересовало как работают такие фреймворки, как Observable Plot, ggplot2 или Vega-Lite? Автора этой статьи всерьез заинтересовал этот вопрос, поэтому он посмотрел множество реализаций, прочитал кучу статей, и кое-что придумал. Пересказывать изучение визуализации целиком было бы глупо (важную чсть исследования составляют примеры и код), поэтому мы вкратце пройдемся по самым важным моментам, а полную цепочку преобразований лучше увидеть своими глазами на сайте. 🤔 Что вообще такое грамматика графики (GoG)? Грамматика графики (GoG) — это язык для определения статистической графики, такой как гистограммы, диаграммы рассеяния и линейные графики из составных частей. Возможно, вы слышали или даже использовали библиотеку, построенную на GoG, такую ​​как Observable Plot, ggplot2, Vega-Lite и Swift Charts. 🔗 Конвейер GoG Грубо говоря, GoG разделяет визуализацию данных на два отдельных этапа: данные - кодировки + метки -> абстрактное пространство - масштабы-> экранное пространство. ⚪ Все начинается с формы Прежде чем мы сможем перейти к реальным компонентам GoG, нам нужен способ рендеринга элемнтов на экране. Для этого используется SVG и создается несколько простых основных элементов: прямоугольник и круг. С помощью этих элементов, впоследствии, будет выстроена вся визуализация. Кстати, некоторое время назад я частично рассказывал про d3.js и даже делился примером. ⚖️ Веса и абстрактное пространство Чтобы сопоставить абстрактное визуальное пространство и пространство пикселей экрана, используются шкалирование. В чем разница между абстрактным и экранным пространством? Экранное пространство — (во всех смыслах и целях) декартова система координат, а абстрактное пространство не обязательно должно быть таковым. Шкалы используются для построения отображений из абстрактного пространства в пространство экрана, чтобы точно передавать информацию, которая заключается в данных. ⏭ Затем в статье объясняются нюансы меток, кодировок, осей и легенды графика, но тут без визуальных объяснений не обойтись, поэтому переходите на сайт. 🚀 В целом, это, конечно, маленькая и неполная версия грамматики графики. Тем не менее, она позволяет рассмотреть весь путь создания визуализации: от исходных данных до графика на экране.