feDisplacementMap地圖在Firefox中看似不起作用

Question

Firefox不支持.png作爲位移貼圖輸入嗎？這是在其他瀏覽器工作，我不知道我做錯了什麼。

<svg x="0px" y="0px" width="810px" height="600px" viewBox="0 0 810 600"> 
 
    <defs> 
 
    <filter id="pixelate" x="0%" y="0%" width="100%" height="100%" primitiveUnits="userSpaceOnUse" color-interpolation-filters="sRGB"> 
 
    \t \t <feImage x="0" y="0" width="15" height="15" xlink:href="https://s3-us-west-2.amazonaws.com/s.cdpn.io/32648/pixelate-map-5.png" result="dis-map"/> 
 
     <feTile in="dis-map" result="pixelate-map" /> 
 
\t \t <feDisplacementMap in="SourceGraphic" in2="pixelate-map" xChannelSelector="R" yChannelSelector="G" scale="40" result="pre-final"/> 
 
\t \t </filter> 
 
    </defs> 
 

 
<image filter="url(#pixelate)" width="810" height="600" preserveAspectRatio="xMidYMid meet" xlink:href="http://uploads2.wikiart.org/images/vincent-van-gogh/the-starry-night-1889(1).jpg"/> 
 
</svg>

Answer 1

火狐實現濾波器效果說明書的security features。

您的feImage指向跨域的東西，這會污染過濾器。如果您將feDisplacementMap過濾器應用於污染的輸出，那麼它將充當通過過濾器，這正是您在這裏看到的。

如果我複製過濾器位圖，所以它對我的PC是本地的，然後過濾器按預期工作。