getImageData() 使用时有跨域问题

设置img的属性 crossOrigin="anonymous"可解决crossOrigin的问题

<img src="http://xxx.cn/xxxx.JPG" id="img1" crossOrigin="anonymous">

首先将img画到canvas中

var img=document.getElementById("img");

ctx.drawImage(img,0,0);

 然后获取所有像素点数据

var imgData=ctx.getImageData(0,0,c.width,c.height);

/*imgData三个属性 data图片像素数据,height图片高度,width图片宽度imgData.data是一个Uint8ClampedArray数组 Uint8ClampedArray是TypedArray 中的一种 Int8Array; Uint8Array; Uint8ClampedArray; Int16Array; Uint16Array; Int32Array; Uint32Array; Float32Array; Float64Array; 颜色值和透明度 4个一组 rgba() 4个值都为0-255范围 data[0] reddata[1] greendata[2] bluedata[3] Alpha*/

canvas 反色

(计算所有像素 颜色值和255之差)

for (var i=0;i