<feMerge>

Baseline 広く利用可能

この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年7月以降、すべてのブラウザーで利用可能です。

もっと詳しく
完全な互換性情報を見る

<feMerge> は SVG の要素で、フィルター効果を順次ではなく並行して適用することができます。これは、他のフィルターが result 属性を通じて出力を格納し、それを <feMergeNode> の子要素内で参照することで実現されます。

他のフィルタープリミティブと同様に、デフォルトで linearRGB 色空間の色成分を処理します。color-interpolation-filters を使用することで、代わりに sRGB を使用することもできます。

使用コンテキスト

カテゴリー	フィルター構成要素
許可されている内容	任意の数、任意の順序の以下の要素。 `<feMergeNode>`

属性

フィルタープリミティブ属性: x, y, width, height, result

<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
  <filter id="feOffset" x="-40" y="-20" width="100" height="200">
    <feOffset in="SourceGraphic" dx="60" dy="60" />
    <feGaussianBlur stdDeviation="5" result="blur2" />
    <feMerge>
      <feMergeNode in="blur2" />
      <feMergeNode in="SourceGraphic" />
    </feMerge>
  </filter>

  <rect
    x="40"
    y="40"
    width="100"
    height="100"
    stroke="black"
    fill="green"
    filter="url(#feOffset)" />
</svg>