Я собираю информацию о проекте, который должен начаться через несколько недель. Этот проект содержит инструмент рисования на основе браузера, в котором пользователи могут добавлять предопределенные формы или сами формировать фигуры. Формы должны выбираться, свободно масштабироваться и поворачиваться с помощью Illustrator-подобного transformtool (ручки). Предопределенные формы, которые мы имеем в виду: прямоугольники, эллипсы, полуэллипсы и (равнобедренные) треугольники.
До сих пор так хорошо, для достижения этого я думал о RaphaelJS или FabricJS, но... Каждая фигура (полигон/путь) должна быть нарисована с помощью определенного угла. И cornerradius должен поддерживаться при масштабировании, поэтому никаких искажений не возникает. Пользователь может указать округление по вводу.
Есть несколько препятствий/вопросов:
- Есть ли какая-то унифицированная математическая формула, чтобы применить угловую форму к фигурам, которые я упомянул? Или каждая форма должна рассматриваться как сам мини-проект? Я хочу вернуть его как путь или поли, поэтому его можно нарисовать с помощью SVG или холста.
- Каждая операция масштабирования или поворота, перетаскивая манипуляторы преобразования, приведет к (массивным) вычислениям для получения обновленной формы, я думаю. Прямоугольники являются самыми легкими для достижения и, кроме эллипсов, все остальные формы будут намного сложнее вычислять. Есть ли способ ускорить процесс?
Я нашел сайт, на котором пользователи могут рисовать блок-схемы и применять угловую форму почти на всех фигурах. Он работает так гладко, я не могу прибить, как они это сделали. Ссылка: https://www.lucidchart.com/ (кнопка "Попробовать" )
В настоящее время я немного невежественный, я думаю, что он посредственный в математике. Возможно, кто-то может подтолкнуть меня в правильном направлении и поделиться некоторыми впечатлениями?
Спасибо заранее.
BTW. Производительность является ключевым в этом проекте. Вывод чертежа должен быть форматом SVG.