SVG FEGaussionBlur.stdDeviationX Property

Last Updated : 30 Mar, 2022

The SVG FEGaussionBlur.stdDeviationX property returns the SVGAnimatedNumber object corresponding to the stdDeviationX component of the FEGaussionBlur.stdDeviationX element.

Syntax:

var a = FEGaussionBlur.stdDeviationX

Return value: This property returns the SVGAnimatedNumber object corresponding to the stdDeviationX component of the FEGaussionBlur.stdDeviationX element

Example 1:

html

<!DOCTYPE html> 
<html> 

<body> 
    <svg viewBox="0 0 1000 1000"> 
        <filter id="lightMe2"> 

            <feGaussianBlur in="FillPaint"
                stdDeviation="10" edgeMode="wrap" id="gfg" /> 

            <feComposite in="SourceGraphic"
                in2="light" operator="arithmetic"
                k1="1" k2="0" k3="0" k4="0" /> 

        </filter> 
        <rect x="20" y="20" width="200"
            height="200" fill="green"
            style="filter: url(#lightMe2);" /> 

        <script type="text/javascript">
                var g = document.getElementById("gfg");
                console.log(g.stdDeviationX)
                console.log("stdDeviationX value is : "
      , g.stdDeviationX.baseVal)
        </script>

    </svg> 
</body> 

</html>

Output:

Example 2:

html

<!DOCTYPE html> 
<html> 

<body> 
    <svg viewBox="0 0 1000 1000"> 
        <filter id="lightMe3" x="-50"
            y="-40" width="200" height="150"> 
            
            <feOffset in="BackgroundImage"
                    dx="10" dy="10" /> 

            <feGaussianBlur in="offset2"
                    stdDeviation="3" id="gfg"/> 

            <feMerge> 
                <feMergeNode in="blur" /> 
                <feMergeNode in="SourceAlpha" /> 
            </feMerge> 

        </filter> 
        <rect x="20" y="20" width="200"
            height="200" fill="green"
            style="filter: url(#lightMe3);" /> 

        <script type="text/javascript">
                var g = document.getElementById("gfg");
                console.log(g.stdDeviationX)
                console.log("stdDeviationX value is : "
             , g.stdDeviationX.baseVal)
        </script>

    </svg> 
</body> 

</html>