Función D3.js divergente.copy()

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.copy () en d3.js se usa para construir y devolver la copia exacta de la escala original. Cualquier cambio en la escala original no afecta la escala de la copia y viceversa.

Sintaxis:

diverging.copy();

Parámetros: Esta función no toma ningún parámetro.

Valores devueltos: Esta función devuelve la copia de la escala original.

A continuación se dan algunos ejemplos de la función dada anteriormente.

Ejemplo 1:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8" /> 
    <meta name="viewport"
        path1tent="width=device-width, 
        initial-scale=1.0"/> 
    <title>GeekforGeeks</title>
    <script src = 
"https://d3js.org/d3.v6.min.js">
</script>
</head> 
<style>
</style>
<body> 
    <h2 style="color:green"> GeeksforGeeks </h2>
    <h4> D3.js | diverging.copy() Function </h4>
    <script> 
        var diverging = 
d3.scaleDiverging(d3.interpolateSpectral);
        // Default domain is used i.e [0, 1]
        document.write(
        "<b>From original scale: </b>");
        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("<b>From copy scale: </b>");
        var divergingCopy = diverging.copy();
        document.write(
"<p>divergingCopy(0.1): ", divergingCopy(0.1) + "</p>");
        document.write(
"<p>divergingCopy(0.2): ", divergingCopy(0.2) + "</p>");
        document.write(
"<p>divergingCopy(0.3): ", divergingCopy(0.3) + "</p>");
    </script> 
</body> 
</html>

Producción:

Ejemplo 2:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8" /> 
    <meta name="viewport"
        path1tent="width=device-width, 
        initial-scale=1.0"/> 
    <title>GeekforGeeks</title>
    <script src=
"https://d3js.org/d3.v6.min.js"></script>
</head> 
<style>
</style>
<body> 
    <h2 style="color:green"> GeeksforGeeks </h2>
    <h4> D3.js | diverging.copy() Function </h4>
    <script> 
        var diverging = 
d3.scaleDiverging(d3.interpolateSpectral);
        // Default domain is used i.e [0, 1]
        document.write(
        "<b>From original scale: </b>");
        document.write(
"<p>diverging(0.1): ", diverging(0.1) + "</p>");
        document.write(
"<p>diverging(0.2): ", diverging(0.2) + "</p>");
        document.write(
"<b>Change in copy scale does not"+
" effect original scale: </b>");
        var divergingCopy = diverging.copy();
        // Domain is changed to [10, 100]
        divergingCopy.domain([10, 100])
        document.write(
"<p>divergingCopy(0.1): ", divergingCopy(0.1) + "</p>");
        document.write(
"<p>divergingCopy(0.2): ", divergingCopy(0.2) + "</p>");
    </script> 
</body> 
</html>

Producción:

Publicación traducida automáticamente

Artículo escrito por TARuN y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *