Simple, unoptimized 1D and 2D convolution functions for typed-arrays.
NOTE: This isn't designed to be high-performance or deal with many, if any, edge cases (like Edge handling) in a particularly rigorous way. You probably do not want to use this in production for anything, ever.
⚠️ Use at your own risk.⚠️
Perform a 3-unit gaussian-blur approximation on a one-dimensional array with edge wrapping:
import { convolution1D, K_GAUSS_BLUR_3 } from '@watercolorizer/convolution';
const data = [1, 2, 3, 4, 5, 6, 7, 8];
const output = [];
convolution2D(K_GAUSS_BLUR_3, data, output);
console.log(output);
/* [3, 2.5, 3.125, 4.03125, 5.0078125, 6.001953125, 7.00048828125, 6.5001220703125] */
Using typed arrays:
import { convolution1D, K_GAUSS_BLUR_3 } from '@watercolorizer/convolution';
const input = Uint8ClampedArray.of(1, 2, 3, 4, 5, 6, 7, 8);
const output = new Uint8ClampedArray(8);
convolution2D(K_GAUSS_BLUR_3, input, output);
console.log(output);
/* [3, 2, 3, 4, 5, 6, 7, 6] */
Built-in Kernels:
-
K_BOX_BLUR_3
- 3-element 1D box blur -
K_GAUSS_BLUR_3
- 3-element 1D gaussian-approximation blur -
K_GAUSS_BLUR_5
- 5-element 1D gaussian-approximation blur -
K_GAUSS_BLUR_7
- 7-element 1D gaussian-approximation blur -
K_BOX_BLUR_3x3
- 3×3-element 2D box blur -
K_GAUSS_BLUR_3x3
- 3×3-element 2D gaussian-approximation blur -
K_GAUSS_BLUR_5x5
- 5×5-element 2D gaussian-approximation blur -
K_GAUSS_BLUR_7x7
- 7×7-element 2D gaussian-approximation blur
You can also use whatever kernel you want:
import { Kernel1D, Kernel2D } from '@watercolorizer/convolution';
const myKernel: Kernel1D = [[-1, 0, 1]];
const laplacian: Kernel2D = [
[0, -1, 0, -1, 4, -1, 0, -1, 0],
[3, 3],
];
Kernels can be either floating point type or integer-with-divisor type kernels... If no divisor is specified in the
kernel, it is assumed to be 1
:
import { Kernel1D } from '@watercolorizer/convolution';
const fractional: Kernel1D = [Float64Array.of(0.25, 0.5, 0.25)];
const integer: Kernel1D = [Uint8Array.of(1, 2, 1), 4];