在上文我们使用canvas手动绘制了一个组织架构图，并且给架构图添加了编辑新增删除等功能，今天我们给它再加点功能，拖动编辑 并且优化一下样式
上篇文章的链接
说明：代码和上篇有不同的地方 我会标注 新增 字段 同时源码也会贴出
效果预览
ps 本来准备写一篇解释说明的 但是代码太长了 大家估计也看不下去 就放弃了 挑几个重点在此处介绍一下啊
为什么不监听click
- 对于触发顺序是 mousedown mouseup click
- 如果继续监听click 会导致 拖拽结束触发目标节点的click事件 极度影响体验
- 因为才用 鼠标按下的事件来判断是click事件还是拖拽事件
如果您有什么好的建议 欢迎评论
同一个父元素的节点拖拽进行的操作是互换位置
- 对于实际的组织架构来说 你的同事很少有机会直接变成你的下属
