Skip to content

Class: Graphviz

graphviz.Graphviz

The Graphviz layout algorithms take descriptions of graphs in a simple text language, and make diagrams in useful formats, such as images and SVG for web pages or display in an interactive graph browser.

Graphviz has many useful features for concrete diagrams, such as options for colors, fonts, tabular node layouts, line styles, hyperlinks, and custom shapes.

See graphviz.org for more details.

ts
import { Graphviz } from "@hpcc-js/wasm/graphviz";

const graphviz = await Graphviz.load();

const dot = "digraph G { Hello -> World }";
const svg = graphviz.dot(dot);

Online Demos

Methods

load

load(): Promise<Graphviz>

Compiles and instantiates the raw wasm.

INFO

In general WebAssembly compilation is disallowed on the main thread if the buffer size is larger than 4KB, hence forcing load to be asynchronous;

Returns

Promise<Graphviz>

A promise to an instance of the Graphviz class.

Defined in

graphviz.ts:107


unload

unload(): void

Unloades the compiled wasm instance.

Returns

void

Defined in

graphviz.ts:116


version

version(): string

Returns

string

The Graphviz c++ version

Defined in

graphviz.ts:123


layout

layout(dotSource, outputFormat?, layoutEngine?, options?): string

Performs layout for the supplied dotSource, see The DOT Language for specification.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
outputFormatFormat"svg"The format of the result.
layoutEngineEngine"dot"The type of layout to perform.
options?OptionsundefinedAdvanced Options for images, files, yInvert and nop.

Returns

string

A string containing the calculated layout in the format specified by outputFormat

Defined in

graphviz.ts:136


acyclic

acyclic(dotSource, doWrite?, verbose?): Object

acyclic is a filter that takes a directed graph as input and outputs a copy of the graph with sufficient edges reversed to make the graph acyclic. The reversed edge inherits all of the attributes of the original edge. The optional file argument specifies where the input graph is stored; by default.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
doWritebooleanfalseEnable output is produced, though the return value will indicate whether the graph is acyclic or not.
verbosebooleanfalsePrint information about whether the file is acyclic, has a cycle or is undirected.

Returns

Object

{ acyclic: boolean, num_rev: number, outFile: string } acyclic will be true if a cycle was found, num_rev will contain the number of reversed edges and outFile will (optionally) contain the output.

NameType
acyclicboolean
num_revnumber
outFilestring

Defined in

graphviz.ts:167


tred

tred(dotSource, verbose?, printRemovedEdges?): Object

tred computes the transitive reduction of directed graphs, and prints the resulting graphs to standard output. This removes edges implied by transitivity. Nodes and subgraphs are not otherwise affected. The ‘‘meaning’’ and validity of the reduced graphs is application dependent. tred is particularly useful as a preprocessor to dot to reduce clutter in dense layouts. Undirected graphs are silently ignored.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
verbosebooleanfalsePrint additional information.
printRemovedEdgesbooleanfalsePrint information about removed edges.

Returns

Object

{ out: string, err: string }.

NameType
outstring
errstring

Defined in

graphviz.ts:201


unflatten

unflatten(dotSource, maxMinlen?, do_fans?, chainLimit?): string

unflatten is a preprocessor to dot that is used to improve the aspect ratio of graphs having many leaves or disconnected nodes. The usual layout for such a graph is generally very wide or tall. unflatten inserts invisible edges or adjusts the minlen on edges to improve layout compaction.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
maxMinlennumber0The minimum length of leaf edges is staggered between 1 and len (a small integer).
do_fansbooleanfalseEnables the staggering of the -maxMinlen option to fanout nodes whose indegree and outdegree are both 1. This helps with structures such as a -> {w x y } -> b. This option only works if the -maxMinlen flag is set.
chainLimitnumber0Form disconnected nodes into chains of up to len nodes.

Returns

string

A string containing the "unflattened" dotSource.

Defined in

graphviz.ts:235


circo

circo(dotSource, outputFormat?, options?): string

Convenience function that performs the circo layout, is equivalent to layout(dotSource, outputFormat, "circo");.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
outputFormatFormat"svg"The format of the result.
options?OptionsundefinedAdvanced Options for images, files, yInvert and nop.

Returns

string

A string containing the calculated layout in the format specified by outputFormat

Defined in

graphviz.ts:265


dot

dot(dotSource, outputFormat?, options?): string

Convenience function that performs the dot layout, is equivalent to layout(dotSource, outputFormat, "dot");.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
outputFormatFormat"svg"The format of the result.
options?OptionsundefinedAdvanced Options for images, files, yInvert and nop.

Returns

string

A string containing the calculated layout in the format specified by outputFormat

Defined in

graphviz.ts:277


fdp

fdp(dotSource, outputFormat?, options?): string

Convenience function that performs the fdp layout, is equivalent to layout(dotSource, outputFormat, "fdp");.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
outputFormatFormat"svg"The format of the result.
options?OptionsundefinedAdvanced Options for images, files, yInvert and nop.

Returns

string

A string containing the calculated layout in the format specified by outputFormat

Defined in

graphviz.ts:289


sfdp

sfdp(dotSource, outputFormat?, options?): string

Convenience function that performs the sfdp layout, is equivalent to layout(dotSource, outputFormat, "sfdp");.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
outputFormatFormat"svg"The format of the result.
options?OptionsundefinedAdvanced Options for images, files, yInvert and nop.

Returns

string

A string containing the calculated layout in the format specified by outputFormat

Defined in

graphviz.ts:301


neato

neato(dotSource, outputFormat?, options?): string

Convenience function that performs the neato layout, is equivalent to layout(dotSource, outputFormat, "neato");.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
outputFormatFormat"svg"The format of the result.
options?OptionsundefinedAdvanced Options for images, files, yInvert and nop.

Returns

string

A string containing the calculated layout in the format specified by outputFormat

Defined in

graphviz.ts:313


osage

osage(dotSource, outputFormat?, options?): string

Convenience function that performs the osage layout, is equivalent to layout(dotSource, outputFormat, "osage");.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
outputFormatFormat"svg"The format of the result.
options?OptionsundefinedAdvanced Options for images, files, yInvert and nop.

Returns

string

A string containing the calculated layout in the format specified by outputFormat

Defined in

graphviz.ts:325


patchwork

patchwork(dotSource, outputFormat?, options?): string

Convenience function that performs the patchwork layout, is equivalent to layout(dotSource, outputFormat, "patchwork");.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
outputFormatFormat"svg"The format of the result.
options?OptionsundefinedAdvanced Options for images, files, yInvert and nop.

Returns

string

A string containing the calculated layout in the format specified by outputFormat

Defined in

graphviz.ts:337


twopi

twopi(dotSource, outputFormat?, options?): string

Convenience function that performs the twopi layout, is equivalent to layout(dotSource, outputFormat, "twopi");.

Parameters

NameTypeDefault valueDescription
dotSourcestringundefinedRequired - graph definition in DOT language
outputFormatFormat"svg"The format of the result.
options?OptionsundefinedAdvanced Options for images, files, yInvert and nop.

Returns

string

A string containing the calculated layout in the format specified by outputFormat

Defined in

graphviz.ts:349


nop

nop(dotSource): string

Convenience function that performs the nop layout, is equivalent to layout(dotSource, "dot", "nop");.

Parameters

NameTypeDescription
dotSourcestringRequired - graph definition in DOT language

Returns

string

A string containing the "pretty printed" dotSource.

Defined in

graphviz.ts:359


nop2

nop2(dotSource): string

Convenience function that performs the nop2 layout, is equivalent to layout(dotSource, "dot", "nop2");.

Parameters

NameTypeDescription
dotSourcestringRequired - graph definition in DOT language

Returns

string

A string containing the "pretty printed" dotSource.

Defined in

graphviz.ts:369

Released under the Apache-2.0 License.