La función d3.stratify() se utiliza para construir y devolver un nuevo operador de estratificación. Este operador tiene su propia configuración predeterminada. Esta función se utiliza para convertir una representación de enlace en forma de árbol en una jerarquía.
Sintaxis:
d3.stratify();
Parámetros: Esta función no acepta ningún parámetro.
Valores devueltos: esta función devuelve una función.
A continuación se dan algunos ejemplos de la función dada anteriormente.
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>
// This is the data of the CSV file
// child, parent
// a,
// b, a
// c, a
// d, a
// e, b
// f, c
// g, c
// h, d
// i, h
// Fetching the csv File
d3.csv("./data.csv",(links)=>{
var child = links.columns[0];
var parent = links.columns[1];
stratify = d3.stratify()
.id(d => d[child])
.parentId(d => d[parent]);
var root=stratify(links)
console.log(root)
});
</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"/>
<title>GeekforGeeks</title>
<script src =
"https://d3js.org/d3.v4.min.js">
</script>
</head>
<body>
<script>
// This is the data of the CSV file
// child, parent
// 0,
// 1, 0
// 2, 0
// 3, 0
// 4, 2
// 5, 3
// Fetching the csv File
d3.csv("./data.csv",(links)=>{
var child = links.columns[0];
var parent = links.columns[1];
stratify = d3.stratify()
.id(d => d[child])
.parentId(d => d[parent]);
var root=stratify(links);
console.log(root.children[0].data);
console.log(root.children[1].data);
console.log(root.children[2].data);
});
</script>
</body>
</html>
Producción:
