最贊回答 / x米多米拉
改成下面這樣了，不知道還有沒有問題，歡迎交流~var blurR = 50; for(var i = 0; i < canvasA.height; i++){ ????for(var j = 0; j < canvasA.width; j++ ){ ????????var r = 0,g = 0,b = 0,totalNum = 0; ????????for(var m = -blurR; m <= blurR; m++){ ??...
2018-08-08
i j 直接從0開始遍歷，當(dāng)blurR半徑比較大的時(shí)候，越界的像素點(diǎn)用另一邊的像素點(diǎn)補(bǔ)充，邊緣就可以模糊一些了，雖然效率有點(diǎn)慢，哈哈哈，四層循環(huán)里面判斷下x y的值就可以了
for(let k = 0; k < blurR; k++){
if( x < 0){
x += canvasb.height;
}else if(x > canvasb.height - 1){
x -= canvasb.height; }
if( y < 0){
y += canvasb.width;
}else if(y > canvasb.width - 1){
y -= canvasb.width;}
}
for(let k = 0; k < blurR; k++){
if( x < 0){
x += canvasb.height;
}else if(x > canvasb.height - 1){
x -= canvasb.height; }
if( y < 0){
y += canvasb.width;
}else if(y > canvasb.width - 1){
y -= canvasb.width;}
}
2018-04-03
最新回答 / JackeyT
這個(gè)問題有意思，就是飽和度的計(jì)算公式，有了這個(gè)公式就和灰度效果的實(shí)現(xiàn)差不多
第一個(gè)：
var imageWidth = canvas.width * scale；
var imageHeight = canvas.height * scale；
var x = (imageWidth - canvas.width) / (2*scale);
var y = (imageHeight - canvas.height)/ (2*scale);
context.drawImage( image , x , y , canvas.width/scale , canvas.height/scale , 0 , 0 , canvas.width , canvas.height )
var imageWidth = canvas.width * scale；
var imageHeight = canvas.height * scale；
var x = (imageWidth - canvas.width) / (2*scale);
var y = (imageHeight - canvas.height)/ (2*scale);
context.drawImage( image , x , y , canvas.width/scale , canvas.height/scale , 0 , 0 , canvas.width , canvas.height )
2018-03-19
第一種方法，只是假想擴(kuò)大了，其實(shí)并沒有，所以最后的坐標(biāo)跟長(zhǎng)寬還要改回去，應(yīng)該是
context.drawImage( image , sx/scale , sy/scale , canvas.width/scale , canvas.height/scale , 0 , 0 , canvas.width , canvas.height )
context.drawImage( image , sx/scale , sy/scale , canvas.width/scale , canvas.height/scale , 0 , 0 , canvas.width , canvas.height )
2018-03-19
下載案例中的blurEffect()的blurR半徑調(diào)整到30的時(shí)候， 明顯發(fā)現(xiàn)周圍一圈沒有被模糊，算法還有待改進(jìn)。
2018-03-05
var mousedown = false
slider.onmousedown = function () {
mousedown = true
}
slider.onmouseup = function () {
mousedown = false
}
slider.onmousemove = function () {
if (mousedown) {
scale = this.value
drawImageByScale(scale)
}
}
slider.onmousedown = function () {
mousedown = true
}
slider.onmouseup = function () {
mousedown = false
}
slider.onmousemove = function () {
if (mousedown) {
scale = this.value
drawImageByScale(scale)
}
}
2018-02-02
溫馨提示：img-lg這個(gè)圖片本來是大的，繪制到canvas上的時(shí)候縮小了，使用放大鏡繪制的時(shí)候，直接使用了這個(gè)圖片，都是據(jù)此計(jì)算的
2018-01-11
