documentationfor yFiles for HTML 2.6

SequenceConstraintData

Specifies sequence constraints for nodes and edges for a HierarchicLayout.

Inheritance Hierarchy
LayoutData
SequenceConstraintData

Remarks

Sequence constraints affect the sequence of nodes within a layer.

If itemComparables are specified, they are used to sort all nodes and edges accordingly and create placeAfter constraints that are handles just like manually added constraints.

Examples

One way to set sequence constraints is by mapping nodes or edges to an IComparable (e.g. a number) which define the order in which those nodes are placed within the same layer. This can be done with the itemComparables property. One way to map each item to such an IComparable is to use the delegate:

Using a delegate to map items to objects that can be ordered to define relative placements within a layer
// Map each item to an IComparable, in this case taken from a custom object stored in the Tag
layoutData.sequenceConstraints.itemComparables = (item) => {
  const data = item.tag
  if (data !== null) {
    return data.sequenceOrder
  }
  // Don't constrain sequencing if the tag doesn't contain our custom object.
  return null
}

If only some nodes should be constrained, the mapper can be used instead:

Using a mapper to map certain items to objects that can be ordered to define relative placements within a layer
// Define sequence constraints for a few nodes via a mapper. Nodes that are not
// explicitly mapped don't have constraints on their placement within the layer.
const mapper = layoutData.sequenceConstraints.itemComparables.mapper
// Place node1 before node2
mapper.set(node1, 1)
mapper.set(node2, 3)
// Place node3 between both of them
mapper.set(node3, 2)
// Place node4 after the others by assigning a larger value
mapper.set(node4, 8)
// The exact values don't matter much they just define an ordering. However, all
// values must have the same type you cannot mix int and string or double, for example.// Define sequence constraints for a few nodes via a mapper. Nodes that are not
// explicitly mapped don't have constraints on their placement within the layer.
const mapper = layoutData.sequenceConstraints.itemComparables
  .mapper as IMapper<INode, any>
// Place node1 before node2
mapper.set(node1, 1)
mapper.set(node2, 3)
// Place node3 between both of them
mapper.set(node3, 2)
// Place node4 after the others by assigning a larger value
mapper.set(node4, 8)
// The exact values don't matter much they just define an ordering. However, all
// values must have the same type you cannot mix int and string or double, for example.

If those mappings have been prepared beforehand, e.g. in a HashMap<TKey,TValue> or IMapper<K,V>, that property on the ItemMapping<TItem,TValue> can also be set:

Setting a prepared mapper or Map for relative placement within a layer
layoutData.sequenceConstraints.itemComparables =
  ItemMapping.from(sequenceMapper)
// Or create the mapping from a Map, instead:
layoutData.sequenceConstraints.itemComparables =
  ItemMapping.from(sequenceMap)layoutData.sequenceConstraints.itemComparables = ItemMapping.from<
  IModelItem,
  IComparable
>(sequenceMapper)
// Or create the mapping from a Map, instead:
layoutData.sequenceConstraints.itemComparables = ItemMapping.from<
  IModelItem,
  IComparable
>(sequenceMap)

IComparable is only the most natural option if such an object can be readily produced from a node, or there already exists such a mapping from nodes to something that can be compared. In many cases it can be easier to construct constraints manually with the respective methods on SequenceConstraintData:

Defining custom sequence constraints
// Ensure that node2 is placed after node1
layoutData.sequenceConstraints.placeAfter(node1, node2)
// Also place another node at the very start
layoutData.sequenceConstraints.placeAtHead(firstNodeInLayer)

Type Details

yfiles module
view-layout-bridge
yfiles-umd modules
view-layout-bridge
Legacy UMD name
yfiles.hierarchic.SequenceConstraintData

See Also

  • Sequence constraints cannot be used together with swimlanes.
  • Sequence constraints that are specified for a group child node will be applied to the parent node instead.

Sample Graphs

Constructors

Properties

Methods