Especificación de vecinos este-oeste
Puede especificar que dos nodos que no están
relacionados entre sí deben ser vecinos directos en una dirección
perpendicular a la dirección del flujo. En las modalidades de diseño de nivel y radial,
los nodos se colocan en el mismo nivel uno junto a otro. En las
modalidades de diseño libre y de volcado, los nodos se colocan
alineados en el borde norte. Estos nodos se conocen como
vecinos este-oeste
porque un nodo se coloca como vecino directo al este del otro nodo.
El otro nodo pasa a ser el vecino directo al oeste del primer nodo.
(Consulte también
Utilizar los puntos cardinales para parámetros de diseño
posicionales (DA) ).
Técnicamente, los nodos se tratan como padre e hijo,
aunque puede que no haya ningún enlace entre ellos. Por lo tanto, uno
de los dos nodos puede tener un padre real, pero el otro nodo no
porque su padre virtual es su vecino
este-oeste.
La característica vecino este-oeste puede utilizarse,
por ejemplo, para anotar nodos de un árbol sintáctico de tipos que se
produce en una construcción del compilador. En
Árbol sintáctico anotado de la sentencia [25] = b[24]
+ 0.5;
se muestra un ejemplo de este tipo de árbol.

Árbol sintáctico anotado de la sentencia [25] = b[24]
+ 0.5;
Para especificar que dos nodos son vecinos este-oeste,
utilice el método:
treeLayout.setEastWestNeighboring(eastNode, westNode);
También puede utilizar la función siguiente, que es
idéntica excepto en el orden del parámetro invertido:
treeLayout.setWestEastNeighboring(westNode, eastNode);
Si la dirección del flujo es hacia abajo, el último
método puede ser más fácil de recordar porque, en este caso, el oeste
está a la izquierda del este en el diseño, lo que se parece al flujo
del texto de los parámetros.
Para obtener el nodo que es el vecino oriental u
occidental de un nodo, utilice las llamadas:
var eastNode = treeLayout.getEastNeighbor(westNode);
var westNode = treeLayout.getWestNeighbor(eastNode);
Cada nodo puede tener como máximo un vecino oriental y
un vecino occidental porque son vecinos
directos. Si se
especifica más de un vecino directo, se pasará por alto parcialmente.
Las especificaciones cíclicas también pueden provocar conflictos. Por
ejemplo, si el nodo B es el vecino oriental del nodo A y el nodo C es
el vecino oriental de B, entonces el nodo A no puede ser el vecino
oriental de C. (Estrictamente hablando, los ciclos de este tipo
pueden ser técnicamente posibles en algunas situaciones en la
modalidad de diseño radial, pero no están permitidos en todas las
modalidades de diseño).
Si B es el vecino oriental de A, entonces A es
automáticamente el vecino occidental de B. El vecino oriental de A
puede tener otro vecino oriental. Por lo tanto, puede crear cadenas
de vecinos este-oeste, que es una forma habitual de visualizar listas
de árboles. En la figura
Cadenas de vecinos este-oeste para visualizar listas
de árboles
se muestran dos ejemplos.

Cadenas de vecinos este-oeste para visualizar listas
de árboles
Recuperación de categorías de enlaces
El algoritmo Diseño de árbol funciona en un árbol de
expansión, como se explica en
El algoritmo DA .
Si el gráfico que se ha de diseñar no es un árbol puro, el algoritmo
pasa por alto algunos enlaces. Para tratar estos enlaces de manera
especial, puede obtener una lista de enlaces que no son de árbol.
Dado que hay padres y nodos hijo en el árbol de
expansión, deben distinguirse las categorías de enlaces siguientes:
- Un enlace de árbol hacia delante es un enlace que va de un padre a su hijo.
- Un enlace de árbol hacia atrás es un enlace que va de un hijo a su padre. Si el enlace se traza como una flecha dirigida, ésta apunta en la dirección opuesta a la dirección del flujo.
- Un enlace que no es de árbol es un enlace entre dos nodos que no están relacionados; ninguno es hijo del otro.

Categorías de enlaces
El algoritmo de diseño utiliza estas categorías de
enlaces internamente pero no las almacena de forma permanente para
ahorrar tiempo y garantizar un uso eficaz de la memoria. Si desea
tratar algunas categorías de enlaces de manera especial (por ejemplo,
para llamar al Diseño de enlaces en los enlaces que no son de árbol),
debe especificar antes de ejecutar el
diseño que desea acceder a las categorías de
enlaces después de ejecutar el
diseño.
Para ello, utilice el método
setCategorizingLinks
de la siguiente manera:
treeLayout.setCategorizingLinks(true); graph.setNodeLayout(treeLayout); graph.performGraphLayout(); var link; var forwardLinks = treeLayout.getCalcForwardTreeLinks(); console.log("forward links:"); while(forwardLinks.hasNext()){ link = forwardLinks.next(); console.log(link.getStartNode().getLabel() + " -> " + link.getEndNode().getLabel()); } var backwardLinks = treeLayout.getCalcBackwardTreeLinks(); console.log("backward links:"); while(backwardLinks.hasNext()){ link = backwardLinks.next(); console.log(link.getStartNode().getLabel() + " -> " + link.getEndNode().getLabel()); } var nonTreeLinks = treeLayout.getCalcNonTreeLinks(); console.log("non-tree links:"); while(nonTreeLinks.hasNext()){ link = nonTreeLinks.next(); console.log(link.getStartNode().getLabel() + " -> " + link.getEndNode().getLabel()); }
Tras haber ejecutado el diseño, puede acceder a las
categorías de enlaces.
Los datos de la categoría de enlaces se rellenan cada
vez que se llama al diseño, a menos que se llame al método
setCategorizingLinks(false).
Secuencias de diseños con cambios incrementales
Puede trabajar con árboles desactualizados, por ejemplo,
los que deben ampliarse con más nodos hijo. Si ejecuta un diseño
después de una ampliación, es probable que desee identificar las
partes que ya se estaban dispuestas en el gráfico original. El
algoritmo Diseño de árbol admite estos cambios incrementales en la
modalidad incremental porque tiene en cuenta las posiciones
anteriores de los nodos.
Conserva el orden relativo de los nodos hijo en el diseño posterior.
En la modalidad no incremental, el algoritmo Diseño de
árbol calcula el orden de los nodos hijo a partir del orden de los
nodos proporcionado por el modelo de gráfico conectado (o gráfico).
En este caso, el diseño es independiente de las
posiciones de los nodos antes de ejecutar el diseño. No conserva el
orden relativo de los nodos hijo en los diseños posteriores.
La modalidad incremental está habilitada de forma
predeterminada.
Para inhabilitar la modalidad incremental:
Llame a:
treeLayout.setIncrementalMode(false);
Edición interactiva
El hecho de que el orden relativo del diseño se conserve
es útil durante la edición interactiva. Le permite
corregir el diseño con facilidad. Por ejemplo, si el primer diseño
coloca un nodo A a la izquierda de su hermano, el nodo B, pero
necesita invertir el orden, basta con mover simplemente el nodo A a
la derecha del nodo B e iniciar un nuevo diseño para arreglar el
dibujo. En el segundo diseño, A sigue estando a la derecha de B y el
subárbol de A “sigue” al nodo A.

Edición interactiva para conseguir un orden
específico de los nodos hijo
Especificación del orden de los nodos hijo
Algunas aplicaciones requieren que los nodos hijo del
árbol tengan un orden relativo concreto. Esto significa, por ejemplo,
que cuando la dirección del flujo es hacia abajo, algunos nodos hijo
se deben colocar a la izquierda de otros nodos hijo.
Se puede conseguir en la modalidad no incremental
especificando un comparador de nodos del modo siguiente:
treeLayout.setNodeComparator(function(node1, node2) { // for example: sort nodes by increasing width return node1.getBounds().width - node2.getBounds().width; });
El comparador especifica el orden definido en la tabla
siguiente. Para la alineación regular, se produce un aumento de las
coordenadas de los nodos hijo. Para la alineación de volcado, se
produce un aumento de la distancia desde el padre. Para las
modalidades de globo y radial, la ordenación se produce en el sentido
de las agujas del reloj.
Modalidad de diseño | Alineación | Dirección del flujo | Orden |
---|---|---|---|
Libre, Nivel, Volcado | no es de volcado | Abajo | de izquierda a derecha |
Arriba | de izquierda a derecha | ||
Izquierda | de arriba abajo | ||
Derecha | de arriba abajo | ||
Libre, Nivel, Volcado | de volcado | Abajo | de arriba abajo |
Arriba | de abajo arriba | ||
Izquierda | de derecha a izquierda | ||
Derecha | de izquierda a derecha | ||
Radial, Globo | cualquiera | cualquiera | en el sentido de las agujas del reloj |