Diseño de gráficos: utilización de la API

En una aplicación que no funciona directamente en los gráficos, las operaciones como conectar o desconectar una instancia de diseño de gráficos deben llevarse a cabo de forma explícita.

La clase base

La case ibm_ilog.graphlayout.GraphLayout es la clase base de todos los algoritmos de diseño. Esta clase es una clase abstracta y no puede utilizarse directamente. Debe utilizar una de sus subclases: ibm_ilog.graphlayout.hierarchical.HierarchicalLayout, ibm_ilog.graphlayout.tree.TreeLayout, ibm_ilog.graphlayout.forcedirected.ForceDirectedLayout, ibm_ilog.graphlayout.shortlink.ShortLinkLayout, ibm_ilog.graphlayout.longlink.LongLinkLayout, ibm_ilog.graphlayout.random.RandomLayout, ibm_ilog.graphlayout.circular.CircularLayout, ibm_ilog.graphlayout.grid.GridLayout. También puede crear sus propias subclases para implementar otros algoritmos de diseño. Consulte Definición de su propio tipo de diseño.
Aunque para obtener los diseños sólo se utilizan directamente las subclases de GraphLayout, necesita conocer esta clase porque contiene métodos que heredan (o alteran) las subclases. Debe saber cómo crear sus propias subclases.
Diagrama
de clases de UML que muestra las subclases de la clase abstracta
GraphLayout y las relaciones de algunas de estas clases con los
distintos informes de diseño. El diagrama de clases utiliza los
convenios de UML normales para representar las clases y las
relaciones. Las clases que implementan los algoritmos de diseño de
gráficos se muestran a la izquierda del diagrama. Las clases de
informes de diseño están a la derecha.
La clase GraphLayout y sus subclases y las relaciones con los informes de diseño

Creación de una instancia de una subclase de la clase base

La clase ibm_ilog.graphlayout.GraphLayout es una clase abstracta. No tiene constructores. Puede crear una instancia de una subclase como se muestra en el ejemplo siguiente:
var layout = new ibm_ilog.graphlayout.tree.TreeLayout();

Cómo conectar o desconectar el diseño de un gráfico o diagrama

En IBM® ILOG® Dojo Diagrammer, debe conectar el diseño con una instancia de un widget ibm_ilog.diagram.widget.Diagram o con una instancia de ibm_ilog.diagram.Graph.
Si utiliza el widget Diagram, conecte el diseño utilizando los atributos nodeLayout o linkLayout del widget Diagram. En el ejemplo siguiente se muestra cómo hacerlo en el código HTML del widget Diagram:
<div jsId="linkLayout" dojoType="ibm_ilog.graphlayout.shortlink.ShortLinkLayout"/>
<div id="diagram" dojoType="ibm_ilog.diagram.widget.Diagram" 
  nodeLayout="treeLayout"/>
El atributo nodeLayout se utiliza para establecer el algoritmo de diseño de gráficos principal que coloca los nodos y enlaces en el widget Diagram. También puede utilizar el atributo linkLayout para establecer un segundo diseño que sólo direcciona los enlaces del widget Diagram. Consulte el ejemplo siguiente:
<div jsId="linkLayout" dojoType="ibm_ilog.graphlayout.shortlink.ShortLinkLayout"/>
<div id="diagram" dojoType="ibm_ilog.diagram.widget.Diagram" 
  linkLayout="linkLayout"/>
También puede establecer el diseño de nodos o enlaces de un Diagram en JavaScript:
var diagram = dijit.byId("diagram");
var treeLayout = new ibm_ilog.graphlayout.tree.TreeLayout();
var linkLayout = new ibm_ilog.graphlayout.shortlink.ShortLinkLayout();
diagram.attr("nodeLayout", treeLayout);
diagram.attr("linkLayout", linkLayout);
Si trabaja directamente con el objeto Graph (es decir, no utiliza el widget Diagram, sino que trabaja directamente con las API de GFX), debe utilizar los métodos setNodeLayout o setLinkLayout para conectar el diseño a Graph:
var graph = surface.createGraph();
var treeLayout = new ibm_ilog.graphlayout.tree.TreeLayout();
var linkLayout = new ibm_ilog.graphlayout.shortlink.ShortLinkLayout();
graph.setNodeLayout(treeLayout);
graph.setLinkLayout(linkLayout);

Ejecución de un diseño

Después de conectar el algoritmo de diseño con una instancia de Diagram o de Graph, utilice el método performGraphLayout de Diagram o Graph para iniciar el diseño:
diagram.performGraphLayout();
o
graph.performGraphLayout();
En este caso se llama al método abstracto protegido layout(boolean redraw) de la subclase GraphLayout. Esto significa que el control se le pasa a la subclase que implementa este método. La implementación calcula el diseño y mueve los nodos a posiciones nuevas o cambia la forma de los enlaces, o hace ambas cosas.
El método getLayoutReport del diseño de gráficos devuelve una instancia de ibm_ilog.graphlayout.GraphLayoutReport (o de una subclase) que contiene información sobre el comportamiento del algoritmo de diseño. Nos indica si el algoritmo se ha ejecutado normalmente o si se ha producido un caso concreto, predefinido. (Para obtener una descripción más detallada del informe de diseño, consulte Utilización de un informe de diseño de gráficos).

Información adicional

Puede encontrar más información sobre la clase ibm_ilog.graphlayout.GraphLayout en los apartados siguientes:
Para obtener más información sobre ibm_ilog.graphlayout.GraphLayout y otras clases de diseño de gráficos, consulte IBM® ILOG® Dojo Diagrammer Documentación de referencia de la API.