为什么统一灰色不是中性位移图？

Question

我一直试图生成一个特定的feDisplacementMap并且失败了。我相信这是因为我对这种机制有一个根本的误解。 SVG 1.1规范说：

  

此滤镜基元使用来自'in2'的图像中的像素值   从'in'空间移位图像。这是转型   待执行：

     

P'（x，y）＆lt; -P（x +标度*（XC（x，y） - .5），y +标度*（YC（x，y） - .5））   其中P（x，y）是输入图像，'in'，P'（x，y）是目的地。   XC（x，y）和YC（x，y）是指定通道的分量值   通过xChannelSelector和yChannelSelector。例如，要使用   'in2'的R分量控制x和G分量的位移   在Image2中控制y中的位移，将xChannelSelector设置为“R”   和yChannelSelector为“G”。

通过我的阅读，这意味着中性灰色图像应该导致没有净像素移动。在尺度= 50的滤波器中的Aka，100,100的像素应该从（100 + 50 *（0.5-0.5），100 + 50 *（0.5-0.5））= 100,100获得其新值。但是，当我尝试使用灰度时，它会将像素映射到源图像的左上方。

<svg width="800px" height="600px" >
  
  <defs>
    <g id="displacerect">
    <rect x="50" y="50" width="300" height="300" fill="rgb(127, 127, 127)"/>
    <rect x="90" y="90" width="50" height="50" fill="red">
      </rect>
    </g>
    
    
      <linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="0%">
      <stop offset="0%" stop-color="rgb(255,255,0)" stop-opacity="1" />
      <stop offset="100%"stop-color="rgb(255,0,0)" stop-opacity="1" />
    </linearGradient>
  
  <filter id="displaceME" x="0%" y="0%" width="100%" height="100%">
    <feImage xlink:href="#displacerect"  result="displaceImage"/>
    <feDisplacementMap scale="125" xChannelSelector="R" yChannelSelector="G" in="SourceGraphic" in2="displaceImage"/>

 
    </filter>
  
  </defs>
  
  <g filter="url(#displaceME)">
  <rect x="50" y="50" width="300" height="300" fill="url(#grad1)"/>
  </g>
  
  <use xlink:href="#displacerect" x="400"/>
  
 
  
</svg>

根据其他消息来源：ACTUAL中性位移图应为此图像：

Answer 1

我遇到了类似的问题。我的源图像和我的置换贴图图像大小相同，因此上面显示的“中性”位移图像可能不正确。必须是红色通道和绿色通道在整个图像上具有相同的恒定值以进行零位移。我无法理解为什么我必须使用188进行零像素移位而不是像你期望的那样使用128。 http://www.tapper-ware.net/blog/?p=39上的博客提供了以下提示，为我解决了问题：

color-interpolation-filters="sRGB"

作者的svg代码段是：

<svg:filter
 id="myFilterId"
 color-interpolation-filters="sRGB" 
 filterUnits="userSpaceOnUse"
 x="0" y="0" width="768" height="512">
</svg:filter>

在将颜色空间指定为sRGB之后，它开始按预期工作。

Answer 2

我的例子中至少可以看到一个错误。

在您的<feDisplacementMap>中，您使用in2引用了置换图像（in2="displacerect"）。但是没有具有该结果值的过滤器原语。我相信你的意思是in2="displaceImage"？

Answer 3

似乎浏览器不遵循此规范，只是复制Photoshop在计算位移时的行为。