Docs / Trees & network

Network graph

Pro

Force-directed nodes and edges for relationship data.

Example

blade 
<chart:graph
    :nodes="[['name' => 'A'], ['name' => 'B'], ['name' => 'C']]"
    :links="[['source' => 'A', 'target' => 'B'], ['source' => 'A', 'target' => 'C']]"
/>

Props

Prop Type Default Description
nodes array [] Node objects ([name, value, category]).
links array [] [source, target] edges.
categories array [] Node categories for coloring.
layout string force force, circular or none.
legend bool false Show the category legend.

Plus the common props (height, theme, model, class).

This is a Pro component

Unlock it and every other Pro chart with a one-time license.

Get WireCharts Pro
Next 3D bar chart →