La clase
ibm_ilog.graphlayout.GraphLayout
define varias características y parámetros genéricos. Estas
características y parámetros pueden utilizarse para personalizar los
algoritmos de diseño.
Aunque la clase
GraphLayout
define los
parámetros genéricos, no controla cómo se utilizan en las subclases.
Cada algoritmo de diseño (es decir, cada subclase de
GraphLayout
) admite un
subconjunto de las características genéricas y determina el modo en
que utiliza los parámetros genéricos. Al crear su propio algoritmo de
diseño mediante subclases de
GraphLayout
, puede decidir si
desea utilizar las características y el modo en que va a utilizarlas. La clase
GraphLayout
define las
siguientes características genéricas:
Soporte de características y parámetros genéricos dado por
los algoritmos
proporciona un resumen de los parámetros genéricos admitidos por cada
algoritmo de diseño. Si está utilizando una de las subclases
suministradas con la API de diseño de gráficos, consulte la
documentación de esa subclase para saber si admite un parámetro
específico y cómo interpreta el parámetro.
Tiempo permitido
Varios algoritmos de diseño pueden diseñarse para
detener los cálculos cuando se supera una especificación de tiempo
definida por el usuario. Esto puede hacerse por motivos diferentes:
por seguridad, para evitar tiempos de cálculo muy largos en gráficos
grandes, o como un límite superior para los algoritmos que mejoran
iterativamente una solución actual y no tienen ningún otro criterio
para detener el cálculo.
Ejemplo de cómo especificar el tiempo permitido
Para especificar que el diseño tiene permiso para
ejecutarse durante 60 segundos:
Llame a:
layout.setAllowedTime(60000);
El tiempo se muestra en milisegundos. El valor
predeterminado es 32000 (32 segundos).
Si utiliza la subclase
ibm_ilog.graphlayout.GraphLayout,
utilice el método siguiente para saber si se ha superado el tiempo
especificado:
layout.isLayoutTimeElapsed();
Para indicar si una subclase de
GraphLayout
admite este
mecanismo, utilice el método: layout.supportsAllowedTime();
La implementación predeterminada devuelve
false
.
Una subclase puede sustituir este método para que devuelva
true
indicando que admite este
mecanismo. Diseño de componentes conectados
La clase base
ibm_ilog.graphlayout.GraphLayout proporciona soporte genérico para el diseño de un
gráfico no conexo (compuesto de componentes conectados).
Para obtener más información, consulte
Diseño de componentes conectados de un gráfico no conexo. .
Ejemplo de diseño
Para habilitar la colocación de gráficos no conexos:
Llame a:
layout.setLayoutOfConnectedComponentsEnabled(true);
Nota
Algunas de las clases de diseño
(
HierarchicalLayout
,
CircularLayout
) tienen un
algoritmo incorporado para colocar componentes conectados. Este
algoritmo está habilitado de forma predeterminada y se adapta a la
mayoría de las situaciones más habituales. Para esta clase de diseño,
el mecanismo genérico proporcionado por la clase base
GraphLayout está
inhabilitado de forma predeterminada. Cuando está habilitado, se utiliza internamente una
instancia predeterminada de la clase
ibm_ilog.graphlayout.grid.GridLayout para colocar los gráficos no conexos. Si es
necesario, puede personalizar este diseño.
Ejemplo de cómo personalizar el diseño
Para personalizar este diseño:
Llame a:
var gridLayout = new ibm_ilog.graphlayout.grid.GridLayout(); gridLayout.setLayoutMode(ibm_ilog.graphlayout.grid.GridLayout.TILE_TO_ROWS); gridLayout.setTopMargin(20); layout.setLayoutOfConnectedComponents(gridLayout);
Ejemplo para expertos
Las distintas posibilidades de la clase
ibm_ilog.graphlayout.grid.GridLayout cubren la mayoría de las necesidades probables de
la ubicación de gráficos no conexos. Si es necesario, puede escribir
su propia subclase de
ibm_ilog.graphlayout.GraphLayout
para colocar gráficos no conexos y especificarla en lugar de
GridLayout:
Llame a:
var myGridLayout = new MyGridLayout(); // settings for myGridLayout, if necessary layout.setLayoutOfConnectedComponents(myGridLayout);
Para indicar si una subclase de
GraphLayout
admite este
mecanismo, utilice el método: layout.supportsLayoutOfConnectedComponents();
La implementación predeterminada devuelve
false
.
Puede escribir una subclase para alterar temporalmente este
comportamiento. Región de diseño
Algunos algoritmos de diseño pueden controlar el tamaño
del dibujo del gráfico y pueden tener en cuenta una
layout region
definida por el usuario.
Ejemplo de cómo especificar un región de diseño
Para especificar una región de 100 por 100:
layout.setLayoutRegion({x:0, y:0, width:100, height:100});
Para acceder a la región de diseño, utilice el método:
var rect = layout.getSpecLayoutRegion();
Este método devuelve una copia del rectángulo que define
la región de diseño especificada.
Los algoritmos de diseño llaman a un método distinto:
var rect = layout.getCalcLayoutRegion();
Este método primero intenta utilizar la especificación
de la región de diseño llamando al método
ibm_ilog.graphlayout.GraphLayout.getSpecLayoutRegion.
Si este método devuelve un rectángulo no nulo, se devuelve este
rectángulo. De lo contrario, el método intenta estimar una región de
diseño adecuada en función del número y el tamaño de los nodos del
gráfico conectado. Si no hay ningún gráfico conectado o el gráfico
conectado está vacío, devuelve un rectángulo predeterminado
{x:0,
y:0, width:1000, height:1000}
. Para indicar si una subclase de
GraphLayout
admite el
mecanismo de la región de diseño, utilice el método: layout.supportsLayoutRegion();
La implementación predeterminada devuelve
false
.
Una subclase puede sustituir este método para que devuelva
true
indicando que admite este
mecanismo. Nota
La implementación del método
ibm_ilog.graphlayout.GraphLayout.layout() sólo es responsable de si la región de diseño se
tiene en cuenta a la hora de calcular el diseño y de qué forma.
Para obtener más información,
consulte la documentación de los algoritmos de diseño.
Link connection box
Si un algoritmo de diseño calcula puntos de conexión
concretos, coloca de forma predeterminada los puntos de conexión de
enlaces en el borde del recuadro delimitador de los nodos,
simétricamente respecto al centro de cada lado. A veces puede ser
necesario colocar los puntos de conexión en un rectángulo menor o
mayor que el recuadro delimitador, posiblemente de forma asimétrica.
Por ejemplo, los puntos de conexión se pueden colocar de forma
asimétrica cuando se muestran etiquetas debajo o encima de los nodos.
Consulte Efecto de la interfaz de
link connection box . Se puede
conseguir especificando una interfaz de
link connection box. La interfaz de
link connection box le permite especificar
para cada nodo un recuadro de nodo diferente del recuadro delimitador
que se utiliza para conectar los enlaces con el nodo.
Ejemplo de la interfaz de
link connection box
Para definir una interfaz de recuadro de conexión de
enlace, llame a:
layout.setLinkConnectionBoxInterface(provider);
Debe implementar la interfaz de recuadro de conexión de
enlace definiendo una clase que implemente la
ibm_ilog.graphlayout.ILinkConnectionBoxProvider.
Esta interfaz define el método siguiente:
getBox(graphModel, node)
Este método permite devolver el rectángulo útil en que
se colocan los puntos de conexión de los enlaces.
Un segundo método definido en la interfaz permite
“desplazar” tangencialmente los puntos de conexión, de un modo
distinto para cada cara de cada nodo:
getTangentialOffset(graphModel, node, nodeSide)
Cómo se utilizan las interfaces y cuáles de los puntos
de conexión que son el resultado final son específicos de cada
algoritmo de diseño.
Diseño jerárquico, Diseño de árbol y Diseño de enlaces
cortos y largos utilizan la interfaz de
link connection box para definir el recuadro
del nodo donde deben conectarse los enlaces.
En la figura siguiente se muestra el efecto de
personalizar el recuadro de conexión. A la izquierda se puede ver el
resultado sin ninguna interfaz de
link connection box. A la derecha se puede
ver el resultado que muestra el efecto cuando la interfaz de
link connection box devuelve el rectángulo
discontinuo del nodo azul.

Efecto de la interfaz de
link connection box
Diseño circular, Diseño aleatorio y Diseño
Force-directed no distribuyen los enlaces
en el borde del nodo, pero pueden direccionar los enlaces para que
apunten al centro del nodo.
Consulte
el método
ibm_ilog.graphlayout.basic.BasicLinkStyleLayout.setConnectLinksToNodeCenters.
Si un nodo tiene una forma irregular, los enlaces a
veces no deben apuntar hacia el centro del recuadro delimitador del
nodo, sino hacia un centro virtual situado dentro del nodo. La
interfaz de link connection box se puede
utilizar para definir el centro virtual del nodo. En la figura
siguiente se muestra un ejemplo del efecto.

Efecto combinado de la interfaz de recorte de enlace
y de link connection box
Si los enlaces están recortados en el nodo verde
irregular en estrella de la izquierda de la figura, no apuntarán
hacia el centro de la estrella, sino hacia el centro del recuadro
delimitador del nodo. Puede corregir este efecto especificando una
interfaz de link connection box que devuelve
un recuadro de nodo menor que el recuadro delimitador, como se
muestra a la derecha de la figura. Opcionalmente, el problema puede
corregirse especificando una interfaz de
link connection box que devuelve el recuadro
delimitador como el recuadro de nodo, pero con desplazamientos
tangenciales adicionales que desplazan el centro virtual del nodo.
Por ejemplo, para establecer una interfaz de recuadro de
conexión de enlace que devuelve un rectángulo de conexión de enlace
que es menor que el recuadro delimitador para todos los nodos de tipo
MyNode y desplaza hacia
arriba los puntos de conexión que hay a derecha e izquierda de todos
los nodos, llame a:
dojo.declare('MyLinkConnectionBoxProvider', ibm_ilog.graphlayout.ILinkConnectionBoxProvider, { getBox: function(graphModel, node) { var rect:Rectangle = graphModel.getBounds(node); if (node is MyNode) { // for example, the size of the bounding box is reduced: rect.x += 4; rect.y += 4; rect.width -= 8; rect.height -= 8; } return rect; } getTangentialOffset: function(graphModel, node, side) { switch (side) { case ibm_ilog.graphlayout.Direction.LEFT: case ibm_ilog.graphlayout.Direction.RIGHT: return -10; // shift up with 10 for both left and right side case ibm_ilog.graphlayout.Direction.TOP: case ibm_ilog.graphlayout.Direction.BOTTOM: default: return 0; // no shift for top and bottom side } } }); layout.setLinkConnectionBoxProvider(new MyLinkConnectionBoxProvider());
Para indicar si una subclase de ibm_ilog.graphlayout.GraphLayout
admite la interfaz de proveedor de recuadro de conexión de enlace,
utilice el método ibm_ilog.graphlayout.GraphLayout.supportsLinkConnectionBox().
La implementación predeterminada devuelve false. Puede
escribir una subclase para sustituir este método con el fin de que
devuelva true, lo que indica que admite este mecanismo.
Cálculo del porcentaje completado
Algunos algoritmos de diseño pueden proporcionar una
estimación de qué porcentaje del diseño se ha completado. Esta
estimación se muestra como un valor de porcentaje que se almacena en
el informe de diseño de gráficos. Cuando se inicia el algoritmo, el
valor de porcentaje se establece en 0. El algoritmo de diseño llama
al método siguiente de vez en cuando para aumentar el valor de
porcentaje progresivamente hasta que llega a 100:
layout.increasePercentageComplete(newPercentage);
Se puede acceder al valor de porcentaje desde el informe
de diseño utilizando el método siguiente:
var percentage = layoutReport.getPercentageComplete();
Para indicar si una subclase de
ibm_ilog.graphlayout.GraphLayout
admite este mecanismo, utilice el método:
layout.supportsPercentageComplete();
La implementación predeterminada devuelve
false
.
Una subclase puede sustituir este método para que devuelva
true
indicando que admite este
mecanismo. Conservar enlaces fijos
A veces, nos interesa “fijar” algunos enlaces del
gráfico (es decir, que se queden en su forma actual cuando se ejecute
el diseño). Nos gustaría tener una forma de indicar a los enlaces que
el algoritmo no puede cambiarlos de forma. Esto tiene sentido
especialmente cuando se utiliza un diseño semiautomático (el método
en que el usuario ajusta manualmente el diseño una vez completado) o
cuando se utiliza un diseño incremental (el método en que el gráfico,
la forma de los enlaces, o ambos se modifican después de haber
ejecutado el diseño y, a continuación, se vuelve a ejecutar el
diseño).
Ejemplo de cómo fijar enlaces
Para especificar que un enlace es fijo:
Utilice el método:
layout.setFixed(link, fixed);
Si el parámetro
fixed
se establece en
true
, significa que el enlace
es fijo. Para obtener el valor actual de un enlace: layout.isFixed(link);
El valor predeterminado es
false
.
Para eliminar el atributo fijo de todos los enlaces del
gráfico, utilice el método:
layout.unfixAllLinks();
Los atributos fijos en los enlaces se tienen en cuenta
sólo si también se llama a la sentencia siguiente:
layout.setPreserveFixedLinks(true);
Para indicar si una subclase de
GraphLayout
admite este
mecanismo, utilice el método: layout.supportsPreserveFixedLinks();
La implementación predeterminada devuelve
false
.
Una subclase puede sustituir este método para que devuelva
true
indicando que admite este
mecanismo. Conservar nodos fijos
A veces, puede que desee “fijar” algunos nodos del
gráfico (es decir, que se queden en su posición actual cuando se
ejecute el diseño). Necesita una forma de indicar a los nodos que el
algoritmo de diseño no puede moverlos. Esto tiene sentido
especialmente cuando se utiliza un diseño semiautomático (el método
en que el usuario ajusta manualmente el diseño una vez completado) o
cuando se utiliza un diseño incremental (el método en que el gráfico,
la posición de los nodos, o ambos se modifican después de haber
ejecutado el diseño y, a continuación, se vuelve a ejecutar el
diseño).
Ejemplo de cómo fijar nodos
Para especificar que un nodo es fijo:
Utilice el método:
layout.setFixed(node, fixed);
Si el parámetro
fixed
se establece en
true
, significa que el nodo es
fijo. Para obtener el valor actual de un nodo: layout.isFixed(node);
El valor predeterminado es
false
.
Para eliminar el atributo fijo de todos los nodos del
gráfico, utilice el método:
layout.unfixAllNodes();
Los atributos fijos en los nodos se tienen en cuenta
sólo si también se llama a:
layout.setPreserveFixedNodes(true);
Para indicar si una subclase de
GraphLayout
admite este
mecanismo, utilice el método: layout.supportsPreserveFixedNodes();
La implementación predeterminada devuelve
false
.
Una subclase puede sustituir este método para que devuelva
true
indicando que admite este
mecanismo. Detener inmediatamente
Varios algoritmos de diseño puede detener los cálculos
cuando se produce un suceso externo, por ejemplo cuando el usuario
pulsa un botón “Detener”.
Para detener el diseño, puede llamar a:
layout.stopImmediately();
El método devuelve
true
si la detención se ha
iniciado y false
si el
algoritmo no se puede detener. El método devuelve el control
inmediatamente, pero la hebra de diseño normalmente necesita algo más
de tiempo después de iniciar la operación de detención para limpiar
las estructuras de datos. Las consecuencias de detener un proceso de diseño
dependen de cada algoritmo de diseño. Algunos algoritmos de diseño
tienen una naturaleza iterativa. Detener el proceso de iteración
produce una ligera pérdida de calidad en el dibujo, pero el diseño
todavía puede darse por válido. Otros algoritmos de diseño tienen una
naturaleza secuencial. La interrupción de la secuencia de pasos del
diseño puede que produzca un diseño que no sea válido. Normalmente, estos
algoritmos vuelven a la situación previa al inicio del proceso de
diseño.
Para indicar si una subclase de
GraphLayout
admite este
mecanismo, utilice el método: layout.supportsStopImmediately();
La implementación predeterminada devuelve
false
.
Puede escribir una subclase para sustituir este método con el fin de
que devuelva true
, lo que
indica que admite este mecanismo.