canvas 的小 demo
1. 音频可视化
2. 小球的自由落体运动
3. 烟花
4. 主题色改变（图片加上滤镜）和拾色器
划过的颜色为：
选中的颜色：
getImageData()
getImageData()方法可以返回一个ImageData对象。
ImageData对象用来描述canvas区域隐含的像素数据，此区域通过矩形表示，起始点为(sx, sy)、宽为 sw、高为 sh
语法：getImageData(sx, sy, sw, sh)
参数：x
sx：将要被提取的图像数据矩形区域的左上角 x 坐标;
sy：将要被提取的图像数据矩形区域的左上角 y 坐标;
sw：将要被提取的图像数据矩形区域的宽度;
sh：将要被提取的图像数据矩形区域的高度;
🎉 ：getImageData(x,y,1,1)：获取距离 x 和 y 位置的 1 像素点的颜色
putImageData()
putImageData()：可以将数据从已有的ImageData对象绘制为位图
语法： putImageData(imagedata, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight)
参数：
ImageData：包含像素值的数组对象。 dx：源图像数据在目标画布中 x 轴方向的偏移量。 dy：源图像数据在目标画布中 y 轴方向的偏移量。 dirtyX：可选参数，在源图像数据中，矩形区域左上角的位置。默认是整个图像数据的左上角（x 坐标）。 dirtyY：可选参数，在源图像数据中，矩形区域左上角的位置。默认是整个图像数据的左上角（y 坐标）。 dirtyWidth：可选参数，在源图像数据中，矩形区域的宽度。默认是图像数据的宽度。 dirtyHeight：可选参数，在源图像数据中，矩形区域的高度。默认是图像数据的高度。