SVG图形编辑器

84 阅读1分钟

前言

上班闲暇时候手撸了一个svg图形编辑器,因为之前没做过类似的,当作学习新知识。基础功能包含旋转、移动、变形、连线(折线、贝塞尔曲线)

贝塞尔曲线

微信图片_20250106105324.png

折线

微信图片_20250106113159.png

旋转

旋转时候还增加了线段延伸点的判断,这样线段可以随着旋转的角度正确向外延伸

微信图片_20250106113756.png 连线只能通过固定的四个顶点进行连接,一开始的想法是想做成可以连接图形的任意位置的,但是后面做的时候发现难度有点大(只实现了直角矩形,后面尝试做圆角矩形的时候发现如果变形的话,如果线段的连接点刚好位于圆角上计算太复杂就放弃了,还是自己太菜了...)