La función d3.scaleDiverging() en D3.js se usa para construir y devolver una escala divergente con un dominio específico y un rango fijo. Las escalas divergentes son muy similares a las escalas continuas. La única diferencia es que el rango de salida de esta escala está fijado por el interpolador, por lo que el rango no es configurable.
Sintaxis:
d3.scaleDiverging( domain, interpolator )
Parámetros: La función anterior acepta dos parámetros como se mencionó anteriormente y se describe a continuación:
- dominio: Este es el rango de valor de entrada máximo y mínimo. Es un parámetro opcional. El dominio predeterminado es [0,1]
- interpolador: Esto toma una función de interpolador. Es un parámetro opcional. La función predeterminada es la función de identidad.
Valores devueltos: esta función no devuelve nada.
A continuación se dan algunos ejemplos de la función dada anteriormente.
Ejemplo 1:
HTML
<!DOCTYPE html>
<html>
<head>
<script src="https://d3js.org/d3.v6.min.js">
</script>
</head>
<body>
<h2 style="color:green">
GeeksforGeeks
</h2>
<h4> d3.scaleDiverging() Function </h4>
<script>
var diverging =
d3.scaleDiverging(
d3.interpolateSpectral
);
// Default domain is used i.e [0, 1]
document.write(" <p>diverging(0.1): ",
diverging(0.1) + "</p>");
document.write("<p>diverging(0.2): ",
diverging(0.2) + "</p>");
document.write("<p>diverging(0.3): ",
diverging(0.3) + "</p>");
document.write("<p>diverging(0.4): ",
diverging(0.4) + "</p>");
document.write("<p>diverging(0.5): ",
diverging(0.5) + "</p>");
document.write("<p>diverging(0.6): ",
diverging(0.6) + "</p>");
</script>
</body>
</html>
Producción:
Ejemplo 2:
HTML
<!DOCTYPE html>
<html>
<head>
<script src="https://d3js.org/d3.v6.min.js">
</script>
</head>
<body>
<h2 style="color:green">
GeeksforGeeks
</h2>
<h4> d3.scaleDiverging() Function </h4>
<script>
var diverging = d3.scaleDiverging(
d3.interpolateRainbow
);
// Default domain is used i.e [0, 1]
document.write("<p>diverging(0.1): ",
diverging(0.1) + "</p>");
document.write("<p>diverging(0.2): ",
diverging(0.2) + "</p>");
document.write("<p>diverging(0.3): ",
diverging(0.3) + "</p>");
document.write("<p>diverging(0.4): ",
diverging(0.4) + "</p>");
document.write("<p>diverging(0.5): ",
diverging(0.5) + "</p>");
document.write("<p>diverging(0.6): ",
diverging(0.6) + "</p>");
</script>
</body>
</html>
Producción:
