使用CamanJS创建图像编辑器：创建自定义滤镜和混合模式

在CamanJS图像编辑器系列的第一篇教程中，我们仅使用内置过滤器来编辑图像 。 这将我们限制在一些基本效果上，例如亮度，对比度以及其他18个更复杂的滤镜，其名称如Vintage，Sunrise等。它们都很容易应用，但是我们无法完全控制所需图像的单个像素。编辑。

在第二个教程中，我们了解了图层和混合模式 ，这使我们可以更好地控制正在编辑的图像。 例如，您可以在画布上添加一个新层，用一种颜色或图像填充它，然后在其上应用混合模式将其放置在父层上。 但是，我们仍然没有创建自己的过滤器，可以应用的混合模式仅限于CamanJS已经提供的模式。

本教程的目的是教您如何创建自己的混合模式和过滤器。 我们还将解决库中存在的一些错误，以及在自己的项目中使用CamanJS时如何修补它们。

创建新的混合模式

默认情况下，CamanJS提供十种混合模式。 这些是正常，乘法，屏幕，覆盖，差异，加法，排除，softLight，变亮和变暗。 该库还允许您注册自己的混合模式。 这样，您可以控制当前层和父层的相应像素如何混合在一起以产生最终结果。

您可以使用Caman.Blender.register("blend_mode", callback);创建新的混合模式Caman.Blender.register("blend_mode", callback); 。 在这里， blend_mode是要用来标识正在创建的混合模式的名称。 回调函数接受两个参数，这些参数包含当前层上不同像素和父层上相应像素的RGB值。 该函数返回一个带有rgb通道最终值的对象。

这是一个自定义混合模式的示例，如果父层中相应像素的通道值超过128，则将像素的各个