关闭Konvajs灰度

Question

我正在使用Konvajs滤镜，让用户能够改变图像的亮度，对比度和灰度。根据KonvaJs的例子，我使用的是输入滑块，效果很好。对于亮度和对比度，我使用：

image.filters([Konva.Filters.Brighten, Konva.Filters.Contrast]);

但对于灰度，我使用输入滑块作为开/关开关和以下滤镜：

image.filters([Konva.Filters.Grayscale]);

因此，当用户将灰度开关设置为“开”时，我可以调用灰度过滤器。但是，如果用户随后将灰度切换为“关闭”，似乎没有办法取消此过滤器。

我有一个涉及取消所有过滤器的变通方法：

image.filters([]);

然后将亮度和对比度滤波器重新调用到先前设置的值。有没有一种方法可以简单地取消灰度过滤器？

Answer 1

删除Konva.Node筛选器的唯一方法是从filters属性中删除它。因此，如果您想要重置过滤器或启用/禁用它们，您应该这样做：

const filters = [];

if (needBrighten) {
  filters.push(Konva.Filters.Brighten);
}
if (needContrast) {
  filters.push(Konva.Filters.Contrast);
}
if (needGrayscale) {
  filters.push(Konva.Filters.Grayscale);
}
node.filters(filters);

你可能需要从你的输入中检测到像needBrighten这样的变量。