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.
La función diverging.domain() se usa para establecer el dominio de la escala. La array de dominio debe tomar tres valores numéricos.
Sintaxis:
diverging.domain([domain]);
Parámetros: esta función acepta un solo parámetro como se mencionó anteriormente y se describe a continuación:
- dominio: Esta es una array que toma tres valores numéricos. El dominio predeterminado de la escala es [0, 0.5, 1].
Valores devueltos: esta función no devuelve nada.
Ejemplo 1:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" path1tent=
"width=device-width,initial-scale=1.0" />
<script src="https://d3js.org/d3.v6.min.js">
</script>
</head>
<body>
<h2 style="color:green"> GeeksforGeeks </h2>
<h4> D3.js | diverging.domain() Function </h4>
<script>
var diverging = d3.scaleDiverging()
// Setting domain of the scale
.domain([4, 0.001, 100]);
document.write("<p>diverging(1): ",
diverging(1) + "</p>");
document.write("<p>diverging(2): ",
diverging(2) + "</p>");
</script>
</body>
</html>
Producción:
Ejemplo 2:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" path1tent=
"width=device-width, initial-scale=1.0"/>
<script src="https://d3js.org/d3.v6.min.js">
</script>
</head>
<body>
<h2 style="color:green"> GeeksforGeeks </h2>
<h4> D3.js | diverging.domain() Function </h4>
<script>
var diverging = d3.scaleDiverging();
// Default scale is identity function
document.write("<p>diverging(10): ",
diverging(10) + "</p>");
document.write("<p>diverging(200): ",
diverging(200) + "</p>");
</script>
</body>
</html>
Producción:
