Комментарии 7
Есть очень интересная библиотека - Three.js (думаю хорошо знакома всем фронтендерам и UI/UX). Чего она только не может... И применений ей масса... Например, красивая "мерцающая-переливающаяся" обводка фигурным блокам, из самого простого. До сложной трехмерной графики и прочего. Отлично годится для визуализации данных и подобных задач.
Из интересных - есть ещё SciChart.js
И много подобных, D3.js, CUBE.gl и множеству других основанных на webGL библиотек.
Сэр, картинок не хватает.
Кстати, мне кажется стоит убрать "Сложный", это отпугнет, для хабра это простой или средний....
Кстати, было бы интересно посмотреть на сравнение генерации SVG при помощи JS и генерации графики при помощи Python и вышеприведённых библиотек. Можно ещё в сравнение Canvas добавить. Было бы интересно оценить разные инструменты генерации двухмерной графики с точки зрения ежедневного применения в фронтенде и не только вышеперечисленные.
На данный момент, всё таки считаю чистый SVG самым удобным. Во-первых, это вектор, во-вторых, это DOM-объект (то есть, возможность навесить анимации через JS), в-третьих, это простой набор чисел, который в случае базовой формы - можно даже руками поправить без особо труда. SVG пока что, лично для меня - во всём выигрывает. И не стоит забывать, что он является базовым стандартом W3C, то есть встроен во все браузеры без использования сторонних библиотек.
А разве three.js - не вектор? И тоже есть во всех браузерах…
SVG удобен в некоторых случаях, но покажите мне как нарисовать линию переменной толщины...
Three.js это комплекс либ. Можно использовать оттуда математику, но отрисовка там WebGL Canvas / WebGPU
Ихихи. Функция Line в three.js это самая платформозависимая забагованная фигня. В SVG можно через path сделать линию переменной ширины (представить что как будто полигон)
Эта отрисовка и делает Three.js вектором. Берём картинку и увеличиваем её раза в три - сразу будет видно, что не растр.
А про линию я в растерянности. Я не знаю ни одной библиотеки где линия переменной толщины делалось бы нормально, а не через полигон или другой изврат. И это очень странно - такая линия должна быть базовой, стилусы с чувствительностью к нажатию появились давным давно.
Картинки ?
Код как кисть: как Python превращается в художника с помощью генеративных алгоритмов