近日，在完成了毕设的大部分功能之后，指导老师认为还需要在添加一些功能，我最后决定添加一个图片编辑功能——图片编辑，由于本人PS有使用过，所以，决定第一个需求就决定是一个可拖拽的选区功能。那就先谈谈实现可拖拽的选区功能的思路。
首先导入一张图片并绘制在画布上，然后选区只是一个只有边框的矩形，每次刷新画布的时候，重新绘制一遍图片和选区的位置，而刷新的频率则通过mousemove来控制，而拖拽选区可分为两种，一种是拖动整个，另一种是拖动一个角。思路大致如此。
现在来将思路实现。
效果预览图：
首先是次要的样式文件和dom结构：
次要
重要的来了，首先创建一个对象imgEdit:
canvas参数为一个dom数据
将imgEdit方法放置在原型对象prototype上，添加第一个方法初始化init:
canvas初始化以及载入图片
以及刷新画布：
刷新画布
在imgEdit中有一个selectArea构造函数，是为了创建和操作选区：
同样地，选区的方法也放置在原型对象上
其中选区绘制：
其次是拖动部位的判断，数字0，1，2，3，代表四个角，'all'则代表整个
拖动判断
拖动的实现：
最后是事件的监听：
如果在移动事件里采取判断移动部位，会导致鼠标移动快时，函数来不及处理，发生mouseout事件。
暂时先完成这一功能，下次继续添加。谢谢观看。
在此附上参考链接：可能需要翻墙
