canvas 已经出来好久了，相信大家多少都有接触。
如果你是前端页面开发/移动开发，那么你肯定会有做过图片上传处理，图片优化，以及图片合成，这些都是可以用 canvas 实现的。
如果你是做前端游戏开发的，可能会非常熟悉，或者说对几何和各种图形变化非常了解。
这里我介绍的是简单的、基本的，但是非常完全的一个 2d 的 canvas 案例。
基本上了解了这些，所有的 canvas 中的 2d 变化基本都可以会了。
先来一个截图看看效果：
如上面所看，可以总结出几个功能点：
1、添加多张图片或者文字到 canvas 。( 这里没有添加文字，我们可以先把文字利用canvas转为图片，然后添加 canvas 上 )
2、图片的缩放，根据选择不同的点实现不同缩放
3、图片移动，改变图片在 canvas 的中心位置
4、图片旋转，根据旋转点在移动的角度进行旋转
5、图片选择，两种方式：一种根据图片的位置，确定当前选择的图形，第二种是点击列表选择
6、数据的保存，提供了保存按钮，保存图形的位置和大小以及旋转角度
7、初始化数据，通过之前保存的数据，重新绘制。
代码案例介绍：
html 代码：
<canvas></canvas> <div></div> <button>保存</button>