Transformations with

What is a transformation ?

  1. Modification of the topology
  2. Computed live
  3. Reversible
  4. Can be serialized

Which transformations ?

  1. Filters
  2. Groups
  3. Generators/Mergers
  4. Virtual Properties

How does it work ?

  • Pipeline
  • Selectors
  • Transformation functions
  • Transformation states

Pipeline

  • Transformations stack up
  • Recomputed after a graph update

Selectors

  • Only visible elements go trhough the selectors
  • Only selected elements are transformed

  ogma.transformations.addNodeFilter((node) => node.getData('country') === 'France');

Transformation functions


ogma.transformations.addNodeGrouping({
  selector: (node) => node.getData('type'),
  groupIdFunction:(node) => node.getData('type'),
  nodeGenerator: (nodes, groupId) => ({
    id: "group_"+ groupId,
    data: {...},
    attributes: {...},
  })
})

Transformation states

Enabled and duration

Cache

Reuse transformations

  • Avoid creating/deleting
  • Use enable/disable
  • Update functions: selectors and generators...

Dynamic Filtres

Groups

Minimise the amount of transformations

  • Easier to maintain
  • Better performances

Groups

Several groups

  • Syles and groups
  • Group the groups

Groups of groups

  • Layout on opening/closing
  • Handle group levels
  • Pinning

Conclusion

Questions ?