项目实训7:项目具体的实现关于svg的各种功能

现在已经是第八周了。经过之前的各种铺垫和讨论，我已经基本上将前端搭建完成，前后端之间也能利用websocket进行通信。

本周的任务：

• 创建图形 ：
• 画布缩放、
• 移动
• 关键点的移动
• 图形的拖动
• 组件：直线、矩形、…（其他视情况）
• 撤销、重做
• 删除
• 保存图片
• 画布网格
• Markdown
  这任务还是挺重的，由于架构的变化，打算使用dom直接操作svg而不是原来的绘制在canvas中。我需要先熟悉一些关于dom操作svg的方法和手段。

1.demo

目标：通过点击屏幕绘制出svg，并通过点击svg组件来触发事件改变属性。
效果图
对dom操作svg有了一定的了解后，我将实际对一些功能进行完成。

2.放缩功能实现

通过scale对画布进行放缩。
紫色部分为svg画布

进度：截止4.14日下午

实现了创建图形，画布缩放，和移动画布的功能。
目前没实现的功能为，随着触摸板的左滑画布实现左滑，只能通过滑动条移动。

功能实现：关键点的移动

关键点的移动，带来的影响是图形参数的改变和许多关键点位置的改变

实现方式为，前端为后端提供参数，后端返回需要修改的参数。