TFO Graphviz

1. 

   Virtual Disk Stack

2. 

   State machine

3. 

   Example page

What is Graphviz?

Graphviz is a way of generating visualisations of [structural relationships between objects. Almost any kind of diagram where [something connects to something else can be drawn and automatically laid [out using the language DOT.

How do I use this plugin?

Use the [graphviz] shortcode. Details are in the Description section.

How to I write DOT?

The online documentation for Graphviz is terse and not especially helpful, in particular the DOT language page is only helpful if you happen to be able to read an approximation of BNF.

There are however several other introductions to Graphviz and DOT, including an excerpt on the O’Reilly LinuxDevCenter.com site. Another approach would be to look at the examples in the Graphviz gallery.

Users should note that DOT syntax varies between Graphviz processors and also between versions of those processors. If in doubt, find an example and experiment with it.

Where can I see examples?

• http://blog.flirble.org/2010/11/12/graphviz-demo/
• http://blog.flirble.org/2015/11/15/adding-svg-support-tfo-graphviz/
• http://blog.flirble.org/2019/06/22/gv-example-state-machine/
• http://blog.flirble.org/2019/06/22/gv-example-various-graphs/

Can I manipulate the rendered graph using CSS in my WordPress theme?

The img elements are tagged with ‘class="graphviz"‘. Additionally, you can add class="myclass" to the shortcode to add additional classes to the img tag.

How can I make my graph have a transparent background?

Add the tag bgcolor="transparent" to the root graph node. For example placing graph [bgcolor="transparent"] near the top like this:

[graphviz]
digraph test {
  graph [bgcolor="transparent"]
  a1 -> a2 -> a3 -> a1;
}
[/graphviz]

Nothing is being rendered, maybe my DOT is broken?

If you’re using a local Graphviz renderer then errors from Graphviz should be presented where you expect the graph to appear. Note that because of how WordPress submits content to plugins the line numbering will not always match what you expect.

The error message when using the dot binary will contain the command line used as well as a line-numbered copy of the DOT that was used.

I’m getting strange errors that make no sense, what gives?

WordPress encodes HTML entities inside the shortcode block which this plugin attempts to demangle.

Unfortunately WordPress can also try to do smart character replacement, such as “…” into a UNICODE ellipsis character. The Graphviz plugin contains a mapping of many of these back to their ASCII equivalents, but it may not be complete. Let us know if you think this is breaking your DOT. It’s also possible that non-ASCII7 characters do strange things too.

Adding define("TFO_GV_DEBUG", true) to wp_config.php will cause the plugin to create some diagnostic files in your system tmp directory. The file pre-N.dot is the contents of the DOT as given to the plugin by WordPress, post-N.dot is the results of the plugin attempting to demangle it. The N is a number that is incremented for each shortcode section interpreted. The plugin does not clean these files up.

How do I install the Graphviz program (not this plugin) locally?

This depends on your local operating system. You will find some details at http://www.graphviz.org/Download.php but many systems also have it in their own package management system, for example this is package graphviz on Debian, Ubuntu and Fedora systems.

There are currently two ways to use a local installation of Graphviz. The settings page will only show options for those methods that are actually available and configured correctly.

1. Using a local Graphviz installation and the dot binary. You configure the path to this binary on the admin settings page of the plugin.
2. Using PHP bindings to the Graphviz library. This requires that gv.php is available.

I’ve installed the PHP bindings but Graphviz doesn’t work!

This requires that gv.php is available and that the associated module is either already loaded or loadable with dl().

The use of dl() is often disabled in php.ini (since it can have security implications) and doesn’t work on multithreaded webservers; it’s entirely disabled in modern Apache2 httpd modules.

For these cases you must ensure the library is loaded with an entry like extension=gv.so or similar somewhere in the PHP configuration.

1.19

• The method override was not working as expected if you fully qualified the method name.

1.18

• The hash that is used to name the generated output for caching was not including all the options for generation; this meant that changing things like the GraphViz language from “dot” to something else or changing the image size was not re-renerating the output.
• Removed all references to the defunct ‘remote’ method.
• Add a mechanism for a method to produce its content inline, not just by URL.
• Experiment with the Graphlib-Dot JavaScript library. See https://github.com/dagrejs/graphlib-dot/wiki.
• Add a method attribute that allows overriding the generation method.
• Better reporting on the admin page when a generation module is not available.

1.17

• HTML decode the content; WP now seems to encode HTML entities between our tags.

1.16

• Add class attribute to the shortcode to enable adding CSS classes to the img tag.
• Make the test graph on the admin page have a transparent background.
• Document emitjs attribute.

1.15

• Validate graph language and output format.
• Some sanity checking in the PHP bindings method.
• Document the need to specify both a shortcode id and a DOT graph name.
• Tested up to WP 4.7.2

1.14

• Finally worked out how to disable wptexturize! Less demangling now required.
• Add an option to control whether we ever emit JavaScript.

1.13

• Better diagnostic output for when running dot doesn’t work, including the command line used and adding the DOT as submitted, with line numbers. (Joachim Durchholz)
• Add more de-mangling rules, for smart quotes and ellipsis. (Joachim Durchholz)
• Improve the newline de-mangling. (Joachim Durchholz)
• Add the SVG output format. See http://blog.flirble.org/2015/11/15/adding-svg-support-tfo-graphviz/ for example. (Joachim Durchholz)
• Add a fix for when the required GV class isn’t loadable, such as when GV gets upgraded on the system. (Sam Wilson)
• Include some JavaScript for when both an image map and width/height scaling is specified. This is required to scale the image map to whatever the image has been scaled to. Image map scaling code comes from https://github.com/davidjbradshaw/image-map-resizer

1.12

• clean_url() and attribute_escape() have both been deprecated. Migrate to esc_url() and esc_attr()`. (Sam Wilson)

1.11

• Remove deprecated constructor definitions. (Sam Wilson)
• Testing against 4.3.

1.10

• Require at least WP 4.2 now.
• Fix use of add_query_arg() to escape its output; a possible XSS vector.
• Added GPL v2 license information.

1.9

• Make some debugging output conditional.
• Fix where that debugging output is stored. (Sam Wilson)

1.8

• Fix a packaging error in 1.7.
• Fix use of hardcoded “/tmp” path. (Sam Wilson)

1.7

• Test upto WP 4.2.2.
• Change an exec("mv...") to using rename() instead. (Sam Wilson)
• Code documentation improvement.
• Some reformatting.

1.6

• Fix some cosmetic documentation issues.

1.5

• Update documentation for using the PHP gv bindings.

1.4

• WordPress 4.0 support.
• Fix for PHP Graphviz module loading; newer PHP’s don’t allow dl() at all in some cases, we should therefore detect this.
• Use WP_Error properly.
• Liberal use of try/catch to detect runtime issues.

1.3

• No changes; version bump for the later 3.x series.

1.2

• Removed leftover diagnostic code in PHP render class (which was appearing in posts!)
• Added remote Graphviz rendering support. Note that this is still young and will add a mark to the graph indicating it was generated by this plugin.
• Tested on WordPress 3.0.2 and 3.0.3.

1.1

• Added support for locally installed PHP bindings to the Graphviz library. This only works if PHP either allows dl() to load a module or gv.so/dll is staticly configured to load in php.ini.
• Made render module selection somewhat more robust.
• Attempt to create our wp-content/tfo-graphviz directory if it doesn’t already exist.
• Better (as in, “any at all”) error generation in the shortcode handler.
• Add content expiration – configurable. Will remove files from the wp-content/tfo-graphviz directory, but only if the threshold is >0 and older than the threshold.

1.0

• First release.