h5-canvas 像素操作

###1.得到场景像素数据

　　getImageData()：获得一个包含画布场景像素数据的ImageData对象，它代表了画布区域的对象数据

　　　　ctx.getImageData(sx,sy,sw,sh)

　　　　　　sx ( sy): 将要被提取的像素数据矩形区域的左上角x （y） 坐标

　　　　　　sw （sh）： 将要被提取的像素数据矩形区域的宽度 ( 高度）

###2.ImageData对象

　　ImageData对象中存储着canvas对象的真实像素数据，包含以下几个只读属性：

　　　　width：图片宽度，单位是像素

　　　　height：图片高度，单位是像素

　　　　data：Uint8ClampedArray类型的一维数组，

　　　　　　包含着RGBA格式的整型数据，范围在0至255之间（包含255）

　　　　　　　　R、G、B、A的值都为0-255    R、G、B指黑色到白色   A指透明到不透明　　(都由0-255逐渐改变)

###3.在场景中写入像素数据

　　putImageData（）方法去对场景进行像素数据的写入

　　putImageData(myImageData， dx， dy)

　　　　dx和dy参数表示你希望在场景内的左上角绘制的像素数据所得到的设备坐标

　　　　　　eg：   设置透明度

　　　　　　　　var imageData = ctx.getImageData(0,0,100,100);

　　　　　　　　for(var i=0;i<imageData.data.length;i++){

　　　　　　　　　　imageData.data[4*i+3] = 100;     //设置该对象的A为100透明度

　　　　　　　　}

　　　　　　　　ctx.putImageData(imageData,0,0);    // 将修改后的对象写入进场景中

###4.创建一个ImageData对象

　　createImageData（width，height）    

　　　　width： 　　ImageData新对象的宽度

　　　　height： 　  ImageData新对象额高度

　　默认创建出来的是透明的