Effects ng Blur sa SVG

<defs> at <filter>

Lahat ng SVG filter ay <defs> ˌnaglalagay sa elemento.<defs> ˌelemento ˈtignan bilang ˈpanghinaan ng ˈpanghahatol (ˈdefinitions), na ˈnagsasama ng ˈpanghahatol sa ˈpartikular na elemento (tulad ng filter).

<filter> ˌelemento ˈtignan bilang ˈpanghinaan ng ˈpanghahatol sa SVG filter.<filter> ˌelemento ˈtignan bilang ˈisang ˈwastong id ˈatrubuto, ˈginamit upang ˈmakilala ang filter. Pagkatapos, ang graph ay ˈnapuntaan ang filter na ˈginamit.

SVG <feGaussianBlur>

ˌhalimbawa 1

<feGaussianBlur> ˌelemento ˈtignan bilang ˈpanghinaan ng paglikha ng epekto ng pagbabulok：

Ito ang kodigo ng SVG：

<svg height="110" width="110">
  <defs>
    <filter id="f1" x="0" y="0">
      <feGaussianBlur in="SourceGraphic" stdDeviation="15" />
    </filter>
  </defs>
  <rect width="90" height="90" stroke="green" stroke-width="3"
  fill="yellow" filter="url(#f1)" />
</svg>

ˌmagsubok-magsubok na!

ˈpaliwanag ng kodigo：

• id ˈatrubuto ng <filter> ˈelemento ˈtignan bilang ˈpang-ˈunang pangalan ng filter
• <feGaussianBlur> ˈelemento ˈtignan bilang ˈpanghinaan ng epekto ng pagbabulok
• in="SourceGraphic" ˈtignan bilang ˈpinagmumulan ng buong epekto ng elemento
• Ang attribute na stdDeviation ay nagtutukoy sa halaga ng blur
• Ang filter attribute ng elemento <rect> ay nagkakabit sa filter "f1"