Type Alias: GraphTrace

type GraphTrace = Omit<CommonTraceAttributes, 'hoverinfo'> & CartesianTraceAttributes & object;

Network graph: nodes and the links between them, at given positions or placed by a layout.

Type Declaration

Name	Type	Description
arc?	GraphTraceArc	Options of arrangement: 'arc'. Lengths are layout units: CSS px at the size the graph is laid out for, before it is fitted to the plot area.
arrangement?	| "preset" | "force" | "layered" | "tree" | "radial" | "dendrogram" | "circular" | "grid" | "arc" | "hive" | "custom"	The layout that places the nodes. 'preset': at node.x / node.y, which are data on the trace's axes. 'force': a force-directed layout, linked nodes pulled together and all nodes pushed apart (options: force). 'layered': a layered drawing of a directed graph, every link pointing the same way (pipelines, dependencies, state machines; options: layered). 'tree': a tidy tree; 'radial': the same tree on rings around its root; 'dendrogram': a tree with its leaves on one line and every other node at the height node.value gives it (options of the three: tree). 'circular': evenly on a circle, the nodes of a group next to each other. 'grid': in rows. 'arc': an arc diagram, the nodes on a line and the links as arcs over it (options: arc). 'hive': a hive plot, the nodes on a few axes around a center (options: hive). 'custom': the layout named by custom.name. Every arrangement but 'preset' hides the axes and gives them one scale, with two exceptions: a dendrogram with node.value shows the axis of its heights, and a 'force' graph whose nodes all have an x and no y (or the reverse) keeps them at those values on a visible axis and moves them along the other one only (a timeline). Default: 'preset' when every node has an x and a y, else 'force'.
custom?	GraphTraceCustom	The layout of arrangement: 'custom'.
force?	GraphTraceForce	Options of arrangement: 'force'. Lengths are layout units: CSS px at the size the graph is laid out for, before it is fitted to the plot area.
highlight?	GraphTraceHighlight	Highlighting: the neighbourhood of the node or link under the pointer (or of highlight.nodes), and a shortest path between two selected nodes or the two of highlight.path. What is highlighted keeps its look, its label shows even where there was no room for it, and everything else is dimmed; nothing is laid out or built again. A hover comes first, then highlight.nodes, then a path.
hive?	GraphTraceHive	Options of arrangement: 'hive'. A link between two nodes of one axis is not drawn: a hive plot shows what goes on between the axes.
hoverinfo?	"all" | "none" | "skip"	Hover of nodes and links: labels ('all'), events without labels ('none') or no hover at all ('skip'). The default of node.hoverinfo and link.hoverinfo.
labels?	DataColumn	Tree input, as the hierarchical traces take it: the label of every node. With parents (and no link.source), every node with a parent gets a link from its parent. The default of node.label.
layered?	GraphTraceLayered	Options of arrangement: 'layered'. Lengths are layout units: CSS px at the size the graph is laid out for, before it is fitted to the plot area.
link?	GraphTraceLink	The links.
lod?	"auto" | true | false	Level of detail: what a large graph leaves out while it is drawn small. 'auto': for a graph of more than 3,000 nodes or 5,000 links; true: for any graph; false: never. With it, node labels are drawn once the nodes are 24 px apart on average, and arrowheads once the links are 24 px long on average (they go again below 18 px, so a zoom at the threshold does not make them flicker); neither is built before. Nodes are drawn smaller where they are closer together than one and a half times their size, down to dots of 1.5 px, and lose their outlines below 4 px. Links fade as they cover more of the plot, so that a dense graph stays a texture instead of a block of one color, and come back to link.opacity on a zoom into it. What a hover or a selection highlights is drawn in full.
node?	GraphTraceNode	The nodes.
parents?	DataColumn	Tree input: the parent of every node, as its id (ids, else labels); '' for a root. A parent that is no node becomes a node of its own, after the others.
selected?	GraphTraceSelected	Style of selected nodes while a selection is active (box or lasso select, selectedpoints). Links between two selected nodes keep their style; the others are dimmed.
tree?	GraphTraceTree	Options of the tree arrangements: 'tree', 'radial' and 'dendrogram'. The tree is the one parents gives; with link.source / link.target, each node hangs from the first node that links to it, starting at the nodes without incoming links, and the links left over are drawn in the link.secondary style. Lengths are layout units: CSS px at the size the graph is laid out for, before it is fitted to the plot area.
type	"graph"	Trace type.
unselected?	GraphTraceUnselected	Style of unselected nodes while a selection is active (box or lasso select, selectedpoints). Links between two selected nodes keep their style; the others are dimmed.
worker?	"auto" | true | false	Where the layout is computed. false: with the rest of the figure, on the main thread; the chart is drawn once, laid out, and the page waits until then (a 'force' layout of 10,000 nodes takes a second or more). true: off the main thread, in the package's layout worker. The chart is drawn at once, a 'force' layout with the nodes moving to their places as the worker reports them, any other with its nodes on a circle until the layout arrives; the axes are fitted to the result when it is there, chart.ready and the promise of the update resolve then, and an image export waits for it. The result is the same picture as with false. 'auto': off the main thread where the wait would be felt: a 'force' layout of at least 1,000 nodes or 5,000 links, a 'layered' one of at least 3,000 nodes or 6,000 links, and force-directed link bundling (link.bundle) of at least 1,000 links. Never in the worker: 'preset', 'circular', 'grid' and 'custom' (a registered layout is a function of the page), a timeline or a dendrogram with a real axis, and force.start at rest. Hover and selection answer for what is on screen while the nodes move; nodes are dragged once the layout is there. Where no worker can be started (no Worker, a Content Security Policy, a bundler that left the file out) the same code runs on the main thread in slices of a few milliseconds, with one warning. Default: config.worker, which is false.
zorder?	number	Stacking order among the traces of a subplot: higher is drawn on top. At equal zorder, scatter traces draw above bars (Plotly’s layer order), then in trace order.