SVG ぼかし効果

<defs> と <filter>

すべてのインターネット SVG フィルタは、 <defs> 要素内に定義します。<defs> 要素は、 definitions の省略形で、特別な要素（filter）などの定義が含みます。

<filter> 要素は、SVG フィルタを定義するために使用します。<filter> 要素は、フィルタを 識別するために id 属性は必須です。その後、グラフィックは使用するフィルタをポイントします。

SVG <feGaussianBlur>

例 1

<feGaussianBlur> 要素は、ぼかし効果を発生させるために使用します：

SVG コードは次の通りです：

コードの説明：

• <filter> 要素の id 属性は、フィルタのユニークな名前を定義します
• ぼかし効果は、<feGaussianBlur> 要素で定義します
• in="SourceGraphic" の部分は、要素全体に対する効果を作成することを定義します
• stdDeviation 属性は、ぼかしの量を定義します
• <rect> 要素の filter 属性は、"f1" フィルタの要素へリンクします