反色(负片)-将图片中的每一个元素进行如下a=255-b运算就可以得到最终的结果

const imageData = cxt.getImageData(0, 0, canvas.width, canvas.height);
const imageData_length = imageData.data.length / 4;
for (var i = 0; i < imageData_length; i++) {
    imageData.data[i * 4] = 255 - imageData.data[i * 4];
    imageData.data[i * 4 + 1] = 255 - imageData.data[i * 4 + 1];
    imageData.data[i * 4 + 2] = 255 - imageData.data[i * 4 + 2];
}

去色效果-算法的原理是采用人眼对RGB不同颜色的敏感程度不同，然后通过得出的加权平均数来运算出最后的结果。公式Gray = (Red * 0.3 + Green * 0.59 + Blue * 0.11)

const red = imageData.data[i * 4];
const green = imageData.data[i * 4 + 1];
const blue = imageData.data[i * 4 + 2];
const gray = 0.3 * red + 0.59 * green + 0.11 * blue;
imageData.data[i * 4] = gray;
imageData.data[i * 4 + 1] = gray;
imageData.data[i * 4 + 2] = gray;

单色效果-将当前像素的其他色值去除

// 假设需要红色，那把蓝色和绿色去除
imageData.data[i * 4 + 1] = 0;
imageData.data[i * 4 + 2] = 0;

中国版画效果-通过判断当前元素的色值是否高于这个给定值，高于我们就显示为黑色，小于我们就显示为白色这样的一种方法来实现的，一般设定126

const red = imageData.data[i * 4];
const green = imageData.data[i * 4 + 1];
const blue = imageData.data[i * 4 + 2];
const gray = 0.3 * red + 0.59 * green + 0.11 * blue;
let new_black;
if (gray > 126) {
    new_black = 255;
} else {
    new_black = 0;
}
imageData.data[i * 4] = new_black;
imageData.data[i * 4 + 1] = new_black;
imageData.data[i * 4 + 2] = new_black;

高斯模糊-两维的卷积模糊操作,通过让图片的每个像素与四周的像素按照某种权重进行分布求值。公式：二维高斯分布函数

浮雕效果与刻雕效果-将某个像素与周边的差值较大的检测出来，然后替换成为255，一般我们将这个常量C设置成为128【255的一半】

(C常量，Xa后一个像素的RGB，Xb前一个像素的RGB)

其中color代表的是最后的色值，Xa和Xb代表的是当前像素前后两点的RGB（中的某一个值），C代表的是一个常量。原理就是将某个像素与周边的差值较大的检测出来，然后替换成为255，一般我们将这个常量C设置成为128【255的一半】

刻雕效果-公式变动