El atributo de radio es el radio para la operación en la primitiva de filtro <feMorphology> . Si se dan dos números, entonces el primer número es el radio x y el segundo número es el radio y. Si solo se da un número, entonces se usa tanto para el eje x como para el eje y.
Nota: Un valor cero o negativo desactiva el efecto de la primitiva de filtro <feMorphology> .
Sintaxis:
radius = number-optional-number
Valores del Atributo: El atributo radio acepta los valores mencionados anteriormente y descritos a continuación:
- número-opcional-número: Es un par de números, donde el segundo número es opcional. Su valor por defecto es 0.
Los siguientes ejemplos ilustran el uso del atributo de radio.
Ejemplo 1:
HTML
<!DOCTYPE html>
<html>
<head>
<style>
text {
font-family: Arial;
font-size: 2.5em;
}
</style>
</head>
<body>
<div style="color: green;">
<h1>
GeeksforGeeks
</h1>
<svg xmlns="http://www.w3.org/2000/svg">
<filter id="Geek1">
<feMorphology operator="erode"
radius=".5" />
</filter>
<text style="filter: url(#Geek1);"
y="1em">Thin Geeky Text</text>
</svg>
</div>
</body>
</html>
Producción:
Ejemplo 2:
HTML
<!DOCTYPE html>
<html>
<head>
<style>
text {
font-family: Arial;
font-size: 2em;
}
</style>
</head>
<body>
<div style="color: green;">
<h1>
GeeksforGeeks
</h1>
<svg xmlns="http://www.w3.org/2000/svg">
<filter id="Geek1">
<feMorphology operator="dilate"
radius="2" />
</filter>
<text style="filter: url(#Geek1);"
y="1em">Thick Geeky Text</text>
</svg>
</div>
</body>
</html>
Producción:
Publicación traducida automáticamente
Artículo escrito por thacker_shahid y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA