Función D3.js scaleOrdinal()

La función d3.scaleOrdinal() se usa para crear y devolver la escala ordinal que tiene el rango y el dominio especificados. Si no se proporcionan el dominio y el rango, ambos se establecen en una array vacía. Estos tipos de escalas tienen un dominio y un rango discretos.

Sintaxis:

d3.scaleOrdinal([[domain, ]range]);

Parámetros:  esta función toma dos parámetros, como se indicó anteriormente y se describe a continuación:

  • dominio: Define el valor mínimo y máximo para la escala.
  • rango:  cada valor en los mapas de dominio con valor en el rango.

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.v4.min.js">
    </script>
</head>
  
<body>
    <script>
  
        // Creating the Ordinal scale.
        var ordinal = d3.scaleThreshold()
  
            // Setting domain for the scale
            .domain([1, 2, 3, 4])
            .range([10, 20, 30, 40]);
          
        console.log("The value of ordinal(1) is: ",
                ordinal(1));
        console.log("The value of ordinal(2) is: ",
                ordinal(2));
        console.log("The value of ordinal(3) is: ",
                ordinal(3));
    </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.v4.min.js">
    </script>
</head>
  
<body>
    <script>
        // Creating the Ordinal scale.
        var ordinal = d3.scaleThreshold()
  
            // Setting domain for the scale
            .domain([1, 2, 3, 4])
            .range(["String1", "string2", 
                    "string3", "string4"]);
  
        console.log("The value of ordinal(1) is: ",
                ordinal(1));
        console.log("The value of ordinal(2) is: ",
                ordinal(2));
        console.log("The value of ordinal(3) is: ",
                ordinal(3));
        console.log("When value given is not"
                + " in the domain:")
        console.log("The value of ordinal(4) is: ",
                ordinal(10));
    </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 *