一些边缘像素遍历不了,总是不会模糊怎么么办,总是一边有一条和原图一样的

来源:4-3 Canvas 更复杂的滤镜效果

白肚子狗熊半本书

2016-11-03 17:34

function five(){

var imageData=ctx1.getImageData(0,0,canvas1.width,canvas1.height);

var pixdata=imageData.data;

var R=1;

var num=(2*R+1)*(2*R+1)

//先遍历出每个像素

for(var i=R;i<canvas2.width-R;i++){

for(var j=R;j<canvas2.height-R;j++){

var totalr=0;

var totalg=0;

var totalb=0;


//在遍历出每一个像素周围的九个像素,让后对着九个像素的r,g,b三个值分别求和在除9得到的值赋给这个像素。

for(var dx=-R;dx<=R;dx++){

for(var dy=-R;dy<=R;dy++){

var x=i+dx;

var y=j+dy;

var p=x*canvas2.width+y;

totalr+=pixdata[p*4+0];

totalg+=pixdata[p*4+1];

totalb+=pixdata[p*4+2];

}

var t=i*canvas2.width+j;

pixdata[t*4+0]=totalr/num;

pixdata[t*4+1]=totalg/num;

pixdata[t*4+2]=totalb/num;

}

}

}

ctx2.putImageData(imageData,0,0,0,0,canvas2.width,canvas2.height);

}


写回答 关注

1回答

  • m慕光
    2016-11-07 15:23:13
    已采纳
    这是正常的,因为根据代码最边上的像素没有被遍历到,也就是没有做处理,人眼的注意力一般集中在图片中心,所以对实际效果影响不大。

    白肚子狗熊半...

    非常感谢!

    2016-11-15 13:29:57

    共 1 条回复 >

Canvas玩转图像处理

canvas系列第三课,学会编写图像算法,一起玩转图像处理吧

60329 学习 · 124 问题

查看课程

相似问题