Элемент фильтра SVG
Опубликовано: 27 Августа, 2022
Элемент 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: обратитесь к другому фильтру.
Пример:
Выход:
Пример: другая форма и настройка тени.
Выход: