Элемент фильтра SVG

Элемент SVG <filter> используется для определения фильтров. Чтобы однозначно идентифицировать фильтр, используйте идентификатор. Фильтры определяются в элементах def.

Синтаксис:

<filter
   filterUnits="units to define filter effect region"
   primitiveUnits="units to define primitive filter subregion"
   
   x="x-axis co-ordinate" 
   y="y-axis co-ordinate"     
   
   width="length"
   height="length"
   
   filterRes="numbers for filter region"
   xlink:href="reference to another filter" >
</filter>

Есть несколько фильтров, предоставляемых SVG.

Ниже приведен список часто используемых фильтров.

• feBlend
• feColorMatrix
• feComponentTransfer
• feComposite
• feConvolveMatrix
• feDiffuseLighting
• feDisplacementMap
• feFlood
• feGaussianBlur
• feImage
• feMerge
• feМорфология
• feOffset — фильтр теней
• feSpecularLighting
• фетиль
• feТурбулентность
• feDistantLight
• fePointLight
• feSpotLight

Атрибуты:

• filterUnits: единицы для определения области воздействия фильтра. Он определяет систему координат для различных значений длины внутри фильтра и для атрибутов, определяющих подобласть фильтра.
• примитивные единицы: единицы для определения области воздействия фильтра. Он определяет систему координат для различных значений длины внутри фильтра и для атрибутов, определяющих подобласть фильтра.
• x: ось x ограничительной рамки фильтра.
• y: ось Y ограничивающей рамки фильтра.
• ширина: ширина ограничивающей рамки.
• Высота: высота ограничивающей рамки.
• filterRes: номер области фильтра.
• xlink:href: обратитесь к другому фильтру.

Пример:

Выход:

Пример: другая форма и настройка тени.

Выход: