SVG/Tutorials/Filter
Mit Filtereffekten können Sie das Rendering eines Elements verändern. Typischerweise werden Elemente, einschließlich ihrer Kinder in einen Puffer (z. B. ein Rasterbild) gezeichnet und dieser Puffer dann im übergeordneten Element angezeigt. Grafikfilter wenden einen Effekt vor der Compositing-Phase an, indem sie das Bild mit einem bestimmten mathematischen Algorithmus verbinden, der auf die gespeicherten RGB-Werte in der Grafik angewendet wird. Beispiele für solche Effekte sind Unschärfe, Änderung der Farbintensität und Verzerren des Bildes.
- Anwendung in CSS
- CSS-Eigenschaft
- CSS Filter-Funktionen
- blur()
- brightness()
- contrast()
- drop-shadow()
- grayscale()
- hue-rotate()
- invert()
- opacity()
- sepia()
- saturate()
- CSS-Animationen
- Filter in SVG
- Das Filter-Element
- Einbindung
- Filter-Universalattribute
- Koordinaten
- Eingangswert in, in2
- Ergebniswert result
- Das Filter-Element
- Licht und Schatten
- Bildmanipulation
- weitere Urfilter (Primitive)
Ursprünglich wurden Filter die Verwendung in SVG entwickelt. Da sie auf fast jede Darstellungsumgebung angewendet werden, einschließlich HTML und CSS, wurden sie neu im Filter Effects Module Level 1 zusammengefasst.
Siehe auch
Referenz
- filter
- feBlend
- feColorMatrix
- feComponentTransfer
- feComposite
- feConvolveMatrix
- feDiffuseLighting
- feDisplacementMap
- feDistantLight
- feDropShadow
- feFlood
- feFuncA
- feFuncB
- feFuncG
- feFuncR
- feGaussianblur
- feImage
- feMerge
- feMergeNode
- feMorphology
- feOffset
- fePointLight
- feSpecularLighting
- feSpotLight
- feTile
- feTurbulence
Attribute
- amplitude
- azimuth
- baseFrequency
- bias
- color-interpolation-filters
- diffuseConstant
- divisor
- edgeMode
- elevation
- exponent
- filterUnits
- in
- in2
- intercept
- k1, k2, k3, k4
- kernelMatrix
- limitingConeAngle
- mode
- numOctaves
- offset
- operator
- order
- pointsAtX
- pointsAtY
- pointsAtZ
- preserveAlpha
- primitiveUnits
- result
- scale
- seed
- slope
- specularConstant
- specularExponent
- stdDeviation
- stitchTiles
- surfaceScale
- tableValues
- targetX
- targetY
- type (feTurbulence)
- type (Transfer Funktionsattribut)
- values
- xChannelSelector
- yChannelSelector
Weblinks
- SVG Filters Playground von Yoksel