SVG <feDisplacementMap>不在PNG中呈现，仅在放大/缩小后在Chrome中呈现

Question

我正在尝试为SVG图像创建相对简单的背景。我已经在GIMP中创建了等效项，从中心到边缘应用径向渐变，然后应用“扩展”滤镜。

至少在Inkscape中，我有以下代码可以实现类似的结果。

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg id="wallpaper"
  viewBox="0 0 1920 1080" height="1080" width="1920"
  xmlns="http://www.w3.org/2000/svg"
  version="1.1"
>
  <defs>
    <radialGradient id="gradient">
      <stop offset="2.5%" stop-color="#ffffff"/>
      <stop offset="100%" stop-color="#000000"/>
    </radialGradient>

    <clipPath id="gradientClip" clipPathUnits="userSpaceOnUse">
      <rect
        id="gradientClip-rect" y="0" x="0" height="1080" width="1920"
      />
    </clipPath>
  </defs>


  <g id="background" clip-path="url(#gradientClip)">
    <rect
      id="background-fill" width="1920" height="1080" x="0" y="0"
      style="fill:#000000;"
    />

    <filter id="gradientNoise">
      <feTurbulence type="fractalNoise" baseFrequency="50" numOctaves="2" result="turbulence"/>
      <feDisplacementMap
        in2="turbulence" in="SourceGraphic" scale="540"
        xChannelSelector="R" yChannelSelector="G"
      />
    </filter>

    <circle
      id="background-gradient" filter="url(#gradientNoise)" fill="url(#gradient)"
      cx="960" cy="540" r="960"
    />
  </g>
</svg>

但是，当我将其光栅化为PNG或在Chrome中打开（以100％缩放）时，我得到的只是没有噪声的渐变。

但是再次，如果我在Chrome中放大或缩小，则滤镜将正确应用。

此文件是否可能仅在以Viewbox中定义的大小查看图像时才会出现这种问题？还有其他我没看到的东西吗？

如果不是出于奇怪的行为，我只会注意到我的PNG问题，this poster只是在将浏览器设置为100％缩放时才注意到。

谢谢！