Definición de la ubicación del nodo y otras propiedades gráficas

La ubicación de un nodo viene determinada generalmente por la información de un elemento del almacén de datos. La ubicación se decide de forma implícita, mediante un diseño predefinido con el uso de enlaces de datos en una plantilla, o de forma más directa en JavaScript, cuando se crea el nodo. Si las posiciones x e y se obtienen directamente de un elemento del almacén de datos, utilice las propiedades xBinding y yBinding para especificar los atributos del almacén de datos que definen las posiciones x e y cuando se crea el nodo o el subgráfico. En almacenes de datos que se pueden modificar, también se utilizan para guardar los valores, si se modifican.
<div id="diagram" dojoType='ibm_ilog.diagram.widget.Diagram' xBinding="xpos" yBinding="ypos"  ...>
</div>

Definición de la ubicación del nodo

Para especificar una posición en el centro de un nodo:
  • Utilice el atributo centerOnLocation.
    En situaciones más complejas, puede definirse una sola función para los valores de lectura y escritura.
    <script type="text/javascript">
    var persistX = function(nodesStore, item, value){
      var retVal;
      if (value) {
        retVal = nodesStore.setValue(item, "xpos", value);
      }
      else {
        retVal = nodesStore.getValue(item, "xpos");
      }
      return retVal;
    };
    </script>
    <div id="diagram" dojoType='ibm_ilog.diagram.widget.Diagram' xBinding="persistX" ...>
    </div>

Definición de propiedades gráficas de nodos y enlaces

Para definir propiedades gráficas generales de nodos y enlaces:
  • Utilice nodesGraphBinding o linksGraphBinding para especificar un atributo de un almacén de datos que pueda utilizarse para guardar una lista de propiedades gráficas.
    <div id="diagram" dojoType='ibm_ilog.diagram.widget.Diagram' nodeGraphBinding="gfxNodeData" nodesGraphProperties="backgroundColor,textColor"  ...>
    </div>
    Puede definirse una sola función para leer y grabar propiedades gráficas.
    <script type="text/javascript">
    var persistNodeProps = function(nodesStore, item, value){
      var retVal;
      if (value) {
         var jvalue = dojo.toJson(value);
         retVal = nodesStore.setValue(item, "gfxNodeData", jvalue);
      }
      else {
          var retValj = nodesStore.getValue(item, "gfxNodeData");
          retVal = dojo.fromJson(retValj);
      }
      return retVal;
    };
    </script>
    <div id="diagram" dojoType='ibm_ilog.diagram.widget.Diagram' nodesGraphBinding="persistNodeProps" nodesGraphProperties="bounds,backgroundColor,textColor" ...>
    </div>
    El valor que se le pasa a la función puede ser un objeto JavaScript complejo, como este:
    {
      "backgroundColor": "#FFFFFF",
      "textColor": "#000000",
      "bounds": {"x": "320", "y": "140", "width": "120", "height": "80"}
    }