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

Mic*_*any 5 graphics svg svg-filters

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

此滤镜基元使用来自"in2"的图像中的像素值来从"in"空间移位图像.这是要执行的转换:

P'(x,y)< - 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中的位移和Image2的G分量来控制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>
Run Code Online (Sandbox Code Playgroud)

根据其他消息来源:ACTUAL中性位移图应该是这个图像:

在此输入图像描述

Pau*_*eau 0

我可以在您的示例中看到至少一个错误。

在您的文件中,<feDisplacementMap>您正在使用 引用您的位移图像 ( in2) in2="displacerect"。但是没有具有该结果值的过滤器基元。我相信你的意思in2="displaceImage"是?