来自灰度的离散值 (0/1)

Question

我为 Snap 创建了一个滤镜插件，旨在 return 离散值 1 用于像素值 (>=0.5,>=0.5,>=0.5) 和 0 值 (<0.5 ,<0.5,<0.5)

为了帮助调试，我使用了从白到黑的线性渐变。

在这个渐变中，最左边的像素是 (1,1,1)，最右边的像素是 (0,0,0)，中间的像素是 (0.5,0.5,0.5)

因此，我希望应用的插件在中间剖析渐变，留下一半完全白色，一半完全黑色，但我的输出 returns 是错误的值，如图所示以下：

如您所见，大约三分之一的渐变是白色，三分之二是黑色，而不是黑白比例相等。

这是我的代码：

Snap.filter.discrete()

Snap.filter.discrete = function () {
    var str = "0 1"
    return Snap.format('<feComponentTransfer>' +
    '<feFuncR type="discrete" tableValues="' + str + '"/>' +
    '<feFuncG type="discrete" tableValues="' + str + '"/>' +
    '<feFuncB type="discrete" tableValues="' + str + '"/>' +
    '</feComponentTransfer>');
};

我哪里错了？

Fiddle: https://jsfiddle.net/z7a49npn/1/

Answer 1

这是由于 SVG 中用于渐变和滤镜的默认颜色空间不匹配造成的：分别是 sRGB 和 linearRGB。如果您添加

color-interpolation-filters="sRGB"

到你的过滤器元素 - 一切都应该工作。

来自灰度的离散值 (0/1)

Discrete values (0/1) from grayscale

svg

svg-filters

snap.svg