html计算值然后载入图片,HTML 5-html5 canvas 如何高效的计算图片的颜色均值

一般的做法就是遍历所有像素，然后计算出平均值，不过你要求效率要高，我想到的办法是把整个图像分成5X5的小块来遍历，判断5X5中间像素点的颜色值是否大于0，如果大于，则计算出此块的颜色总值，如果等于0则跳过此块不用遍历，最后把所有块遍历完，就能算出平均值了，下面是用canvas实现的部分代码，供参考一下吧：

Your browser does not support the canvas element.

var c=document.getElementById("myCanvas");

var cxt=c.getContext("2d");

var img=new Image()

img.src="/i/eg_flower.png"

cxt.drawImage(img,0,0);

for(var i=0;i<200;i+=5 ){

for(var j=0;i<100;j+=5 ){

var imageData = cxt.getImageData(i,j,i+5,j+5);

var pix = imageData.data;

//判断中心点的颜色值是否大于0

if( (pic[48]+pic[49]+pic[50])==0 ) continue;

for(var k=0, len=pix.length; k

//计算颜色平均值

...

}

}

}