API

Model Visualizer

class ModelVisualizer(options)

Visualizer and Visual Editor for AltWalker and GraphWalker JSON models.

Creates new instance of ModelVisualizer.

For configuring graphLayoutOptions checkout {@link https://github.com/dagrejs/dagre/wiki#configuring-the-layout Dagre Wiki}.

Arguments:

  • options (Object) – The visualizer options.

  • options.container (string|HTMLElement) – The container or container id where the model will be rendered.

  • options.models (Object) – The models to be rendered.

  • options.editMode (Boolean) – Enable or disable editMode.

  • options.onModelsChange (function) – Called when the model changes. Called only if editMode is enabled. It’s called with one parameter the new value of the models.

  • options.legendContainer (string) – The container id where the legend will be rendered.

  • options.graphLayoutOptions (Object) – The dagreD3 graph layout options.

  • options.graphLayoutOptions.rankdir (Object) – Direction for rank nodes. Can be TB, BT, LR, or RL, where T = top, B = bottom, L = left, and R = right.

  • options.graphLayoutOptions.align (Object) – Alignment for rank nodes. Can be UL, UR, DL, or DR, where U = up, D = down, L = left, and R = right.

  • options.graphLayoutOptions.nodesep (Object) – Number of pixels that separate nodes horizontally in the layout.

  • options.graphLayoutOptions.edgesep (Object) – Number of pixels that separate edges horizontally in the layout.

  • options.graphLayoutOptions.ranksep (Object) – Number of pixels between each rank in the layout.

  • options.graphLayoutOptions.marginx (Object) – Number of pixels to use as a margin around the left and right of the graph.

  • options.graphLayoutOptions.marginy (Object) – Number of pixels to use as a margin around the top and bottom of the graph.

  • options.graphLayoutOptions.acyclicer (Object) – If set to greedy, uses a greedy heuristic for finding a feedback arc set for a graph. A feedback arc set is a set of edges that can be removed to make a graph acyclic.

  • options.graphLayoutOptions.ranker (Object) – Type of algorithm to assigns a rank to each node in the input graph. Possible values: network-simplex, tight-tree or longest-path.

Throws:

  • ValidationError – If the models are invalid but plottabel.

  • PlottingError – If the models are invalid and not plottabel.

ModelVisualizer.getModels()

Returns the current models.

ModelVisualizer.repaint()

Repaints the model. Call this method if the container is resized.

ModelVisualizer.setEditMode(editMode)

Switches from edit to view mode.

Arguments:

  • editMode (Boolean) – If set to true will switch to edit mode.

ModelVisualizer.setGraphLayoutOptions(graphLayoutOptions)

Sets dagreD3 graph layout options.

Arguments:

  • graphLayoutOptions (Object) – The dagreD3 graph layout options.

  • graphLayoutOptions.rankdir (Object) – Direction for rank nodes. Can be TB, BT, LR, or RL, where T = top, B = bottom, L = left, and R = right.

  • graphLayoutOptions.align (Object) – Alignment for rank nodes. Can be UL, UR, DL, or DR, where U = up, D = down, L = left, and R = right.

  • graphLayoutOptions.nodesep (Object) – Number of pixels that separate nodes horizontally in the layout.

  • graphLayoutOptions.edgesep (Object) – Number of pixels that separate edges horizontally in the layout.

  • graphLayoutOptions.ranksep (Object) – Number of pixels between each rank in the layout.

  • graphLayoutOptions.marginx (Object) – Number of pixels to use as a margin around the left and right of the graph.

  • graphLayoutOptions.marginy (Object) – Number of pixels to use as a margin around the top and bottom of the graph.

  • graphLayoutOptions.acyclicer (Object) – If set to greedy, uses a greedy heuristic for finding a feedback arc set for a graph. A feedback arc set is a set of edges that can be removed to make a graph acyclic.

  • graphLayoutOptions.ranker (Object) – Type of algorithm to assigns a rank to each node in the input graph. Possible values: network-simplex, tight-tree or longest-path

ModelVisualizer.setModels(models)

Rerenders the graph with the new models.

Arguments:

  • models (Object) – The models.

Throws:

PlottingError – If the models are invalid and not plottable.

ModelVisualizer.setOnModelsChange(onModelsChange)

Sets the callback used when models are being updated in edit mode.

Arguments:

  • onModelsChange (function) – Called when the model changes. Called only if editMode is enabled. It’s called with one parameter the new value of the models.

static ModelVisualizer.validate(models)

Validate the models.

Arguments:

  • models (Object) – The models to be validated.

Throws:

  • ValidationError – If the models are invalid but plottable.

  • PlottingError – If the models are invalid and not plottable.

Exceptions

class exceptions.ModelVisualizerError()

Base error for ModelVisualizer.

exceptions.ModelVisualizerError.ModelVisualizerError
class exceptions.ValidationError()

Error for invalid but plottable graphs.

exceptions.ValidationError.ValidationError
class exceptions.PlottingError()

Error for unplottable graphs.

exceptions.PlottingError.PlottingError