convolve

Canvas convolution filter.

API

convolve(matrix)

Return a new convolution Filter with the given matrix.

Filter#factor(n)

Change the factor to n, defaults to 1.

Filter#bias(n)

Change the bias to n, defaults to 0.

Filter#width(n)

Canvas width.

Filter#height(n)

Canvas height.

Filter#apply(input, result)

Apply the convolution filter to the input ImageData, populating the result ImageData. This is a lower-level method, you most likely want to apply to the entire canvas, in which case use below:

Filter#canvas(canvas)

Apply the convolution filter to the entire canvas and immediately draw the results.

Example

varconvolve=require('convolve');varcanvas=document.querySelector('canvas');varctx=canvas.getContext('2d');varimg=newImage;img.onload=draw;img.src='maru.jpg';varsharpen=[[-1,-1,-1],[-1,9,-1],[-1,-1,-1]];varblur=[[0,.2,0],[.2,.2,.2],[0,.2,0],];// factor 1 / 7varmotionBlur=[[1,0,0,0,0,0,0],[0,1,0,0,0,0,0],[0,0,1,0,0,0,0],[0,0,0,1,0,0,0],[0,0,0,0,1,0,0],[0,0,0,0,0,1,0],[0,0,0,0,0,0,1]];varedges=[[0,-1,0],[-1,4,-1],[0,-1,0]];functiondraw(){canvas.width=img.width;canvas.height=img.height;ctx.drawImage(img,0,0);convolve(motionBlur).factor(1/7).canvas(canvas);}

License

MIT