Cette page a été traduite à partir de l'anglais par la communauté.Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.
<feGaussianBlur>
Baseline Widely available *
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis octobre 2018.
* Certaines parties de cette fonctionnalité peuvent bénéficier de prise en charge variables.
La primitive de filtreSVG<feGaussianBlur> applique un effet de flou à l'image en entrée. La quantité de flou est contrôlée parstdDeviation.
Dans cet article
Contexte d'utilisation
Attributs
>Attributs globaux
Attributs spécifiques
Interface DOM
Cet élément implémente l'interfaceSVGFEGaussianBlurElement.
Exemple
>Exemple simple
SVG
html
<svg width="230" height="120" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <filter> <feGaussianBlur in="SourceGraphic" stdDeviation="5" /> </filter> <circle cx="60" cy="60" r="50" fill="green" /> <circle cx="170" cy="60" r="50" fill="green" filter="url(#blurMe)" /></svg>Résultat
Exemple avec une ombre portée
SVG
html
<svg width="120" height="120" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <filter> <feGaussianBlur in="SourceAlpha" stdDeviation="3" /> <feOffset dx="2" dy="4" /> <feMerge> <feMergeNode /> <feMergeNode in="SourceGraphic" /> </feMerge> </filter> <circle cx="60" cy="60" r="50" fill="green" filter="url(#dropShadow)" /></svg>Résultat
Spécifications
| Specification |
|---|
| Filter Effects Module Level 1> # feGaussianBlurElement> |