D3.js es una biblioteca construida con JavaScript y particularmente utilizada para la visualización de datos. La función nest.sortKeys() se usa para clasificar las claves en un orden particular, es decir, ascendente o descendente.
Sintaxis:
nest.sortkeys( comparatorFunction )
Parámetros: esta función acepta una función de comparación de un solo parámetro que se utiliza para especificar cómo ordenar las claves. Si no se especifica ninguna función de comparación para la clave actual, no se define el orden en que se devolverán las claves.
Valor devuelto: Devuelve la clave ordenada (ascendente/descendente) según la función de comparación.
Los siguientes programas ilustran la función nest.sortKeys() en D3.js.
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> <title> D3.js nest.sortKeys() Function </title> </head> <body> <script> // Dataset var cars = [ { name: "car1", manufactured: "1950", model: "s51" }, { name: "car1", manufactured: "1952", model: "s51" }, { name: "car1", manufactured: "1951", model: "s50" }, { name: "car1", manufactured: "1953", model: "s52" }, { name: "car1", manufactured: "1953", model: "s50" }, { name: "car1", manufactured: "1950", model: "s52" }, ]; var groupedData = d3.nest() .key(function (d) { return d.manufactured; }) // sorting keys in ascending order .sortKeys(d3.ascending) .entries(cars); console.log("ArrayData :", groupedData); </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> <title> D3.js nest.sortKeys() Function </title> </head> <body> <script> var cars = [ { name: "car1", manufactured: "1950", model: "s51" }, { name: "car1", manufactured: "1952", model: "s51" }, { name: "car1", manufactured: "1951", model: "s50" }, { name: "car1", manufactured: "1953", model: "s52" }, { name: "car1", manufactured: "1953", model: "s50" }, { name: "car1", manufactured: "1950", model: "s52" }, ]; var groupedData = d3.nest() .key(function (d) { return d.manufactured; }) // Sorting keys in descending order .sortKeys(d3.descending) .entries(cars); console.log("ArrayData :", groupedData); </script> </body> </html>
Producción: