canvas实现对像素的基本处理操作//获取像素数据varcanvas=document.getElementById('CanvasElt');varctx=canvas.getContext('2d');//获取canvas中的像素信息,//x为开始复制的左上角位置的x坐标。//y开始复制的左上角的y坐标。//width要复制的矩形区域的宽度。//heigh待复制矩形区域的高度。varcanvasData=ctx.getImageData(x,y,canvas.width,canvas.height);//写入像素信息ctx.putImageData(canvasData,0,0);获取到的canvasData对象包含以下成员，数据数组结构大致是这样的，一行一行存储，然后一列一列存储。每个点占用4个下标，分别为RGBA。对于坐标(x,y)（这里y是下面的正方向），RGBA分别是data[(ywidth+x)4],data[(ywidth+x)4+1],data[(ywidth+x)4+2]，数据[(ywidth+x)4+3]。如果你能得到像素，你就可以对像素进行操作。最简单的就是灰度处理。灰度处理的方法有很多种。最简单的方法是将每相的r、g、b相加得到平均值，然后分别赋值给r、g、b。//灰度处理函数gray(){varimageData=ctx1.getImageData(0,0,canvas1.width,canvas1.height);for(vari=0;i
