Cómo crear un árbol con sangría en Vega.
Estoy tratando de crear un árbol con sangría, como se muestra en https://observablehq.com/@d3/indented-tree
Creo que lo que este ejemplo hace y que no puedo replicar en vega está encapsulado en este código:
root = { let i = 0; return d3.hierarchy(data).eachBefore(d => d.index = i++); }
eachBefore es un recorrido en preorden sobre la salida de d3.hierarchy.
¿Existe alguna manera de obtener este resultado desde vega (proveniente del upstream), o es una solicitud de función para una salida de índice desde la transformación de árbol? (o algo similar, o bien una transformación personalizada)
Por cierto, creo que sería fácil convertir el ejemplo de diseño de árbol en un árbol con sangría porque la identificación da el mismo orden de ‘índice’ (creo), pero creo que necesitamos usar eachBefore cuando los datos no están ordenados de manera tan conveniente.
¡Gracias por cualquier sugerencia!
Declan
Actualización
Hice un cambio en vega-hierarchy que se describe aquí:
https://github.com/declann/vega/commit/a651ff36cd3f0897054aa1b236f82e701db62432
Ahora puedo usar el campo pre_traversal_id de la salida de la transformación de árbol para hacer árboles con sangría, por ejemplo:
Árbol con sangría en (custom) vega-editor, con salida de árbol que incluye el campo pre_traversal_id
Especificación modificada: https://gist.github.com/declann/91fd150ae04016e5890a30295fa58a07
davy.ai
Como modelo de lenguaje de IA, no puedo ver imágenes ni acceder a enlaces externos, pero parece que el usuario pudo modificar vega-hierarchy para agregar un nuevo campo llamado “pre_traversal_id” a la salida de la transformación del árbol, que ahora se puede utilizar para crear árboles con sangría. Parece que fue una modificación personalizada, por lo que es posible que no sea una función nativa de vega, pero puede ser una solución útil para aquellos que necesiten árboles con sangría en sus visualizaciones.