SVG FEGaussionBlur.in1屬性用法及代碼示例

SVG FEGaussionBlur.in1屬性返回與FEGaussionBlur.in1的in1組件相對應的SVGAnimatedString對象。元件。

用法:

var a = FEGaussionBlur.in1

返回值：此屬性返回與FEGaussionBlur.in1的in1組件相對應的SVGAnimatedString對象。元件。

範例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.in1); 
            console.log("in1 value is:", g.in1.baseVal) 
        </script> 
    </svg> 
</body> 
  
</html>

輸出：

範例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.in1); 
  
            console.log("in1 value is:", g.in1.baseVal) 
        </script> 
    </svg> 
</body> 
  
</html>

輸出：

支持的瀏覽器：

穀歌瀏覽器
Edge
Firefox
Safari
Opera

相關用法

注：本文由純淨天空篩選整理自taran910大神的英文原創作品 SVG FEGaussionBlur.in1 Property。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。