Binding Data to Graph Elements

yFiles FLEX provides an elegant mechanism to associate custom information with instances of arbitrary type. Most notably, this mechanism can be used to conveniently bind data to graph elements, i.e., model items from an IGraph.

The IMapper interface defines a general means to bind a value V to a given key K. Using INode instances as key K, for example, supplemental data can easily be associated with the nodes of a graph.

Example 9.3. Using IMapper to store and retrieve custom data for nodes

// Store custom data for the nodes of a graph.
function createRectanglesForNodes(graph:IGraph, tag:Object):void {
  // Bind some data to each node in the graph.
  var result:IMapper = new DictionaryMapper();
  for (var it:Iterator = graph.nodes.iterator; it.hasNext(); ) {
    var node:INode = it.next();
    result.mapValue(node, createRectangleForNode(node));
  }
  
  // Retrieve the graph mapper registry.
  var registry:IMapperRegistry = graph.mapperRegistry;
  // Add the mapper.
  registry.addMapper(tag, result);
}

// Later retrieve the data stored for the nodes.
function getRectanglesForNodes(graph:IGraph, tag:Object):void {
  var registry:IMapperRegistry = graph.mapperRegistry;
  var result:IMapper = registry.getMapper(tag);
  if (null != result) {
    for (var it:Iterator = graph.nodes.iterator; it.hasNext(); ) {
      var node:INode = it.next();
      var rect:IRectangle = result.lookupValue(node);
      // ...
    }
  }
}

Interface IMapperRegistry enables registration of IMapper instances with a graph by tag. The registry can be retrieved using the IGraph property mapperRegistry.

See Chapter 5, Communicating with the Server and the section called “Using Simple Data Types” for information on how to add graph model item attributes registered in a mapper registry for GraphML input/output operations.

Adding custom mapper attributes for server roundtripping is also covered in a Knowledge Base article.