Categoría: HTML-SVG

Propiedad SVG Document.scripts

Posted on by Rudeus Greyrat

La propiedad SVG Document.scripts devuelve la lista de elementos de script en el documento. Sintaxis: var scriptList = document.scripts Valor devuelto: esta propiedad devuelve la lista de elementos de script en el documento. Ejemplo 1:  HTML <!DOCTYPE html> <html>    <body>     <script></script>     <svg width=»700″ height=»500″          xmlns=»http://www.w3.org/2000/svg»>         <script>             console.log(document.scripts);         </script>     </svg> </body>    </html> Producción: Ejemplo … Continue reading «Propiedad SVG Document.scripts»

Atributo de decoración de texto SVG

Posted on by Rudeus Greyrat

El atributo de decoración de texto define si el texto se escribe con tachado, sobrerayado y/o subrayado. La principal diferencia entre la propiedad de decoración de texto CSS y el atributo de decoración de texto SVG es que SVG utiliza los valores de ‘ relleno ‘ y ‘ trazo ‘ para pintar las decoraciones de … Continue reading «Atributo de decoración de texto SVG»

Propiedad del cuerpo del documento SVG

Posted on by Rudeus Greyrat

La propiedad SVG Document.body r Sintaxis: const objRef = document.body Valor devuelto: Esta propiedad r Ejemplo 1:  HTML <!DOCTYPE html>  <html>     <body>      <svg width=»350″ height=»500″          xmlns=»http://www.w3.org/2000/svg»>         <circle cx=’100′ cy=’100’r=»100″></circle>            <script>             console.log(document.body)         </script>     </svg> </body>     </html> Producción: Ejemplo 2:  HTML <!DOCTYPE html>  <html>     <body>      <svg width=»500″ height=»500″          xmlns=»http://www.w3.org/2000/svg»>            <text x=’100′ y=’100′ … Continue reading «Propiedad del cuerpo del documento SVG»

Atributo SVG fr

Posted on by Rudeus Greyrat

Sintaxis: fr=»radius» Valores de atributos: longitud: Longitud en la que queremos establecer el radio. porcentaje: Porcentaje en el que queremos establecer el radio. Usaremos el atributo fr para establecer el radio del elemento. Ejemplo 1: HTML <!DOCTYPE html> <html>    <body>     <svg viewBox=»0 0 600 200″          xmlns=»http://www.w3.org/2000/svg»>                    <defs>             <radialGradient id=»gradient1″                  cx=»0.3″ cy=»0.3″ r=»0.5″                  fx=»0.55″ … Continue reading «Atributo SVG fr»

Propiedad SVG LineElement.x1

Posted on by Rudeus Greyrat

La propiedad SVG LineElement.x1 devuelve un objeto SVGAnimatedLength correspondiente al atributo del elemento de línea dado. Sintaxis: LineElement.x1 Valor de retorno: esta propiedad devuelve el objeto SVGAnimatedLength que se puede usar para obtener el «x1» del elemento de línea. Ejemplo 1:  HTML <!DOCTYPE html> <html>    <body>     <svg width=»350″ height=»350″          xmlns=»http://www.w3.org/2000/svg»>                    <line x1=»10″ x2=»150″ … Continue reading «Propiedad SVG LineElement.x1»

SVG <feTurbulencia> Elemento

Posted on by Rudeus Greyrat

El filtro SVG <feTurbulence> genera ruido que es útil para simular varios fenómenos naturales como nubes, fuego y humo, y para generar texturas complejas como mármol o granito. El ruido se puede utilizar para distorsionar imágenes y texto. La función de turbulencia Perlin se utiliza para generar ruido Perlin. Sintaxis: <feTurbulence type = «» baseFrequency … Continue reading «SVG <feTurbulencia> Elemento»

Longitud de SVGAjustar atributo

Posted on by Rudeus Greyrat

El atributo lengthAdjust se usa para decidir la extensión del texto dentro de la longitud definida por el atributo textLength . Los elementos que utilizan este atributo son <text>, <textPath>, <tref> y <tspan>. Sintaxis: lengthAdjust = spacing | spacingAndGlyphs Valores de atributo: el atributo lengthAdjust acepta los valores mencionados anteriormente y descritos a continuación. Espaciado: … Continue reading «Longitud de SVGAjustar atributo»

Atributo de visibilidad SVG

Posted on by Rudeus Greyrat

El atributo de visibilidad le permite controlar la visibilidad de los elementos gráficos. Solo tiene efecto en los siguientes elementos <a>, <altGlyph>, <audio>, <canvas>, <circle>, <elipse>, <foreignObject>, <iframe>, <image>, <line>, <path >, <polígono>, <polilínea>, <rect>, <texto>, <textPath>, <tref>, <tspan>, <video> Sintaxis: visibility = visible | hidden | collapse Valores de atributo: el atributo de visibilidad … Continue reading «Atributo de visibilidad SVG»

SVG <ver> Elemento

Posted on by Rudeus Greyrat

SVG significa Gráfico vectorial escalable. Se puede usar para hacer gráficos y animaciones como en el lienzo HTML. El elemento <view> se utiliza para modificar los atributos de viewbox del elemento SVG original. Se usa al hacer referencia a la identificación del elemento como el fragmento de destino de una URL. Proporciona funciones como acercar … Continue reading «SVG <ver> Elemento»

Atributo SVG FETurbulenceElement.seed

Posted on by Rudeus Greyrat

La propiedad SVG FETurbulenceElement.seed devuelve el objeto SVGAnimatedNumber correspondiente al componente semilla del elemento FETurbulenceElement.seed. Sintaxis: var a = FETurbulenceElement.seed Valor de retorno: esta propiedad devuelve el objeto SVGAnimatedNumber correspondiente al componente semilla del elemento FETurbulenceElement.seed. Ejemplo 1:  HTML <!DOCTYPE html>  <html>     <body>         <svg width=»400″ height=»400″         viewBox=»0 0 250 250″>             <filter id=»FillPaint»>  … Continue reading «Atributo SVG FETurbulenceElement.seed»