DokuWiki

It's better when it's simple

User Tools

Site Tools


plugin:graphgear

Graph Gear Plugin

Compatible with DokuWiki

2009-12-15+

plugin Visualize directed and undirected graphs in flash using Graphviz notation. Graphviz not required.

Last updated on
2016-02-03
Provides
Syntax
Repository
Source

Similar to graphviz

Tagged with diagram, flash, graphviz, images, media

This plugin uses the Graph Gear flash to display directed or undirected graphs using the popular Graphviz syntax. Images and Links can be attached to the nodes of the graph. An example of the plugin in use can be seen here.

Download and Installation

Download and install the plugin using the Plugin Manager using the download link given above. Refer to Plugins on how to install plugins manually.

Changes

Syntax and Usage

Graphs

Graphs are defined by the <graphgear></graphgear> tags. The body contains the nodes and edges as explained below. The opening tag can contain optional comma separated parameters.

Complete Example:

<graphgear width=500,height=300,label="My first Graph">
  node1 [label="My first node", fillcolor="lightblue"]
  node2 [label="My second node"]
  
  node1 -> node2 [label="An edge from node1 to node2", fontcolor="red"]
</graphgear>

The following parameters are supported:

Parameter Value Default Description
label any text A title for the graph
width a number 725 The width of the graph in pixels
height a number 400 The height of the graph in pixels
bgcolor a color ffffff (white) The background color of the whole canvas
linecolor a color cccccc (gray) The color of the edge lines
mode undirected or directed undirected Have the edges of the graph a direction?
viewmode explore or display explore In explore mode only the first node and it's children is shown initially, in display mode all nodes are shown. The latter is very CPU intensive

Nodes

A node is defined by its name, optionally followed by a parameter list in square brackets.

Example:

node1 [label="My first node", fillcolor="lightblue"]

Only the following graphviz parameters are supported:

Parameter Value Default Description
label any text The node name A label, describing the node
fillcolor a color cccccc (gray) The background color of the node and its label
fontcolor a color 000000 (black) The color of the label text
url a link Clicking the label will open the given page, can be external or a wiki page
image a image The image will be shown inside the node bubble, can be external or internal
shape circle or box circle The shape of the node. Only circles and squares are supported. A few more graphviz shapes will be recognized as box

Edges

An edge is defined by giving two node names separated by a ->, optionally followed by a parameter list in square brackets.

Example:

node1 -> node2 [label="An edge from node1 to node2", fontcolor="red"]

Only the following graphviz parameters are supported:

Parameter Value Default Description
label any text A label, describing the edge
fontcolor a color 000000 (black) The color of the label text

Colors

All colors can be defined as HTML hex codes or as X11 Graphviz color names.

Limitations

  • The SWF currently contains a MochiBot tracking code – the software is GPL, shouldn't be a problem to remove the code, but Flash might be needed to do so
  • Certain Graphviz syntax features are not supported yet (Comments, multiline data, possibly more)
  • Only a subset of the Graphviz syntax for nodes and edges is supported (see above for a list), everything else is ignored
plugin/graphgear.txt · Last modified: 2016-07-06 20:43 by andi