SVG FEDisplacementMap.in2 Propiedad

La propiedad SVG FEDisplacementMap.in2 devuelve el objeto SVGAnimatedString correspondiente al componente in2 del elemento FEDisplacementMap.

Sintaxis:

let in_prop = FEDisplacementMap.in2

Valor devuelto: esta propiedad devuelve el objeto SVGAnimatedString correspondiente al componente in2 del elemento FEDisplacementMap.

Ejemplo 1: 

HTML

<!DOCTYPE html>
<html>
<body>
  <svg width="200" height="200"
       viewBox="0 0 220 220">
  
    <filter id="displacementFilter">
  
      <feTurbulence type="turbulence"
        baseFrequency="5" 
        numOctaves="2" 
        result="turbulence" />
  
      <feDisplacementMap in2="abc" 
        in="SourceGraphic" 
        scale="200" xChannelSelector="B"
        yChannelSelector="R" id="gfg" />
    </filter>
  
    <rect width="250" height="250" style=
          "filter: url(#displacementFilter)" />
  
    <script type="text/javascript">
      var g = document.getElementById("gfg");
      console.log(g.in2)
      console.log("in2 value is : ",
                  g.in2.baseVal)
    </script>
  </svg>
</body>
</html>

Producción:

Ejemplo 2: 

HTML

<!DOCTYPE html>
<html>
<body>
  <svg width="200" height="200"
       viewBox="0 0 220 220">
  
    <filter id="displacementFilter">
  
      <feTurbulence type="turbulence"
        baseFrequency="1"
        numOctaves="2" 
        result="turbulence" />
  
      <feDisplacementMap in2="turbulence"
        in="SourceGraphic"
        scale="50" 
        xChannelSelector="R" 
        yChannelSelector="B"
        id="gfg" />
    </filter>
  
    <circle cx="100" cy="100" r="100"
            stroke="green" style=
            "filter: url(#displacementFilter)" />
  
    <script type="text/javascript">
      var g = document.getElementById("gfg");
      console.log(g.in2);
      console.log("in2 value is : ",
                  g.in2.baseVal)
    </script>
  </svg>
</body>
</html>

Producción:

Navegadores compatibles:

  • Google Chrome
  • Borde
  • Firefox
  • Safari
  • Ópera
  • explorador de Internet

Publicación traducida automáticamente

Artículo escrito por taran910 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *