Applying a graph layout

Most of the time, the data store does not contain any explicit information regarding the position of nodes on the screen. To obtain a readable graph representation, the Diagram can apply a graph layout algorithm that places the nodes automatically once the graph has been created.
To specify the graph layout algorithm in the markup:
  • Use the nodeLayout attribute:
    <div dojoType="ibm_ilog.graphlayout.tree.TreeLayout" jsId="myLayout"/>        
        
       <div id="canvas" dojoType='ibm_ilog.diagram.widget.Diagram' nodeLayout="myLayout"  automaticNodeLayout="true" ... >
       </div>
To modify the parameters of the graph layout in JavaScript:
  • Use the following code:
    <div dojoType="ibm_ilog.graphlayout.tree.TreeLayout" jsId="myLayout"/>        
    
       <script type="text/javascript">
            ...
          myLayout.setFlowDirection(ibm_ilog.graphlayout.Direction.RIGHT);
       </script>
    For more information about graph layout algorithms, see Introducing graph layout.