Fork of Page Flow

100%

Fork of Page Flow

✓ Published0🌍 Public

Last edited Oct 12, 2021

Created on Oct 12, 2021

This example shows a page-flow workflow diagram with colored nodes for sources, pages, and desired or undesired events, linked to illustrate navigation paths. Built with GoJS 2.1.2, it uses diagram templates for nodes and links, editable text blocks, and a layered digraph layout. Users can click a plus button on any selected node to add a new connected node, while the undo manager tracks modifications and the mouse wheel zooms the canvas.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Page Flow

Page Flow is a workflow diagram that visualizes navigation paths between web pages, distinguishing source pages, desired events, and undesired outcomes with color-coded nodes. Built with the GoJS diagramming library, it supports editable node labels, a layered digraph layout, and an undo manager. Users can click an adornment button to add new connected nodes, and the diagram zooms via mouse wheel events, following forward-only linking rules.

JJoker-tr

88% match

Loading thumbnail…

Fork of Fault Tree

This example demonstrates a fault tree diagram built with GoJS, showing hierarchical relationships through nodes connected by orthogonal links. Each non-root node displays a gate shape—including AndGate, OrGate, Circle, or Triangle—with distinct color fills and an attached choice label. The diagram uses a TreeLayout with a vertical angle and implements drag-to-rearrange tree functionality. Code examples include node template bindings that dynamically set shape figures, fill colors, and rotation angles based on data properties, with undo/redo support enabled through the diagram’s UndoManager.

AAlex Velez

71% match

Loading thumbnail…

Fork of Interactive Force Directed Layout

A fork of the Interactive Force Directed Layout example uses GoJS to demonstrate a continuously running force-directed layout where users can push and pull nodes. The layout automatically spreads nodes apart while dragging, with selected nodes remaining fixed. The diagram uses circular node templates and arrowed links with labels, styled through GoJS GraphObject.make. The code includes a model change listener to invalidate the cached network when structure changes.

VVictor Lorena

70% match

Loading thumbnail…

Fork of Interactive Force Directed Layout

This example demonstrates an interactive force-directed graph layout using the gojs library (yFiles for HTML). The visualization continuously re-runs a layout algorithm as users drag nodes, with selected nodes remaining fixed while all others are repositioned. The graph displays nodes as circles with text labels, connected by links featuring arrowheads and gradient-backed labels. The implementation extends `go.ForceDirectedLayout` with a `ContinuousForceDirectedLayout` subclass, optimizing performance by caching the network and only updating bounds for selected nodes during drag operations. The example also includes Node.js templates with binding for text content and custom link styling.

SSina Ja

69% match

Loading thumbnail…

Fork of Interactive Force Directed Layout

This example demonstrates an interactive force-directed graph using the GoJS library, where nodes and links can be pushed and pulled around the canvas. The layout continuously runs as users drag nodes, keeping selected nodes fixed while automatically repositioning all others. It uses a custom `ContinuousForceDirectedLayout` that extends GoJS’s built-in layout, with the diagram’s `draggingTool` triggering layout invalidation during drag operations. The code also includes standard GoJS node and link templates, with circular node shapes and arrow-headed links.

Mmah-far

68% match

Loading thumbnail…

Fork of Interactive Force Directed Layout

This example demonstrates a continuously operating force-directed graph layout where users can push and pull nodes around the canvas. Built with the GoJS library, it uses a custom `ContinuousForceDirectedLayout` subclass that keeps selected nodes fixed while moving all others, and performs a layout update during dragging by invalidating the layout. The graph renders circular nodes with text labels connected by directed links with arrowheads, and the layout is reused across interactions for efficiency.

CColin

68% match

Loading thumbnail…

Fork of Interactive Force Directed Layout

This interactive force-directed graph demonstrates a continuously running layout where users can push and pull nodes, with selected nodes remaining fixed while others rearrange. Built using GoJS 2.1.2, the `ContinuousForceDirectedLayout` subclass overrides the standard layout to cache the network and reuse it across frames, recalculating positions only for unselected nodes during drag operations. The diagram uses circle-shaped nodes with text labels and directed links with arrowheads, updating the layout live as users interact with the graph.

JJinnaF

68% match

Loading thumbnail…

Fork of Interactive Force Directed Layout

An interactive force-directed graph demonstrates a continuous layout algorithm where users can push and pull nodes, with selected nodes remaining fixed while others reposition. Built with the gojs library (go.ForceDirectedLayout), the diagram updates in real-time during dragging by invalidating the layout and reusing a cached network. Nodes and links use custom templates for shapes, labels, and arrowheads, while the drag tool triggers layout recalculation on mouse movement.

SSatpreet Makhija

66% match