La función d3.style() en D3.js se usa para diseñar el Node especificado (atributo) con el nombre especificado (Valor). En esto, si el Node tiene un estilo en línea con el nombre especificado, se devuelve su valor y si el Node no tiene un estilo en línea, se devuelve el valor calculado.
Sintaxis:
d3.style(node, name)
Parámetros: esta función acepta dos parámetros, como se mencionó anteriormente y se describe a continuación:
- Node: Esta es una propiedad del elemento seleccionado.
- nombre: Este es el valor del atributo especificado.
Valor devuelto: esta función devuelve la propiedad de estilo de valor para el Node especificado (atributo) con el nombre especificado (Valor).
Los siguientes ejemplos ilustran la función d3.style() en D3.js
Ejemplo 1:
html
<!DOCTYPE html>
<html>
<head>
<title>
D3.js | d3.style() Function
</title>
<script src=
"https://d3js.org/d3.v4.min.js">
</script>
</head>
<body>
<p style="color: green;">
GeeksforGeeks
</p>
<p style="color: green;">
A computer science portal for geeks
</p>
<script>
// Calling the style() function
d3.select("p").style("color", "red");
</script>
</body>
</html>
Producción:
Ejemplo 2:
html
<!DOCTYPE html>
<html>
<head>
<title>
D3.js | d3.style() Function
</title>
<script src=
"https://d3js.org/d3.v4.min.js">
</script>
</head>
<body>
<p style="color: green;">
GeeksforGeeks
</p>
<p style="color: green;">
A computer science portal for geeks
</p>
<script>
// Calling the style() function
d3.select("p").style("font-size", "40px");
</script>
</body>
</html>
Producción:
