Graph Selector

A Concise Demonstration

A quick example showing how Graph Selector gets us from an encoding to a working graph in seconds.

Installation

To add graph-selector to your project, install it with the package manager of your preference.

npm install graph-selector

ID's & Classes

Use CSS style selectors to add ID's and classes to nodes in your graph.

Loading...

Creating Edges with Labels

Create directed edges between nodes using indentation and add labels to them with text before the colon (:).

Loading...

Class Connections

Use classes to create different types of relationships between nodes and edges in your graph.

Loading...

Attributes

Learn how to use data attribute syntax to store data on nodes that impacts the graph that is rendered.

Loading...

D3 Bar Graph

Create a d3 bar graph from data attributes stored on nodes.

Loading...

Sankey Diagram

Create data-driven Sankey diagrams to visualize flows.

Loading...

Images

Use different techniques to display images in different contexts in your graph.

Loading...

Tabular Data

Use tabular data to create your graph, such as US-Canada migration data from 1955-1988.

Loading...

Support Us

Please consider donating to our open-source efforts to help us develop and improve Graph Selector!

Sponsor