Graphviz是一个强大的开源的图形软件包，不仅支持桌面应用，也支持Web应用，其关键技术在于它的自动布局和布线功能。
安装libgv-php5后，Graphviz支持PHP编程，可以实现浏览器上显示图形。然而，整个开发环境的安装与设置相对比较复杂一些，需要相当的专业技术。
Graphviz是一个开源软件，有源码，支持不同平台。linux系统下使用XDot程序显示dot格式的文件。
Graphviz显示图形时，可以选择不同的策略进行布局和布线显示图形。
Graphviz的官方网站（点击进入）：Graphviz | Graphviz - Graph Visualization Software。
Web版的Graphviz网站（点击进入）：Webgraphviz。
PHP代码如下（其中保护若干调试代码，已经注释了）：
<!DOCTYPE html>
<html lang="zh-CN"><head><meta charset="utf-8"><title>GVPHP</title>
</head><?php
// ini_set('display_errors', true);// if( !(bool)ini_get( "enable_dl" ) || (bool)ini_get( "safe_mode" ) ) {
// ECHO "dh_local(): Loading extensions is not permitted.\n";
// } else {
// ECHO "OK";
// }// http://www.graphviz.org/pdf/dotguide.pdf page 23include('libgv-php5/gv2.php');$g = gv::digraph('G'); //line 1$N = gv::protonode($g); // line 3$cluster0 = gv::graph($g, 'cluster0'); // line 2gv::setv($N, "style", "filled"); // line 3gv::setv($N, "color", "white"); // line 3gv::setv($cluster0, "style", "filled"); // line 4gv::setv($cluster0, "color", "lightgrey"); // line 5gv::edge($cluster0, 'a0', 'a1'); //line 6gv::edge($cluster0, 'a1', 'a2'); //line 6gv::edge($cluster0, 'a2', 'a3'); //line 6gv::setv($cluster0, "label", "process #1"); // line 7$cluster1 = gv::graph($g, 'cluster1'); // line 10gv::setv($N, "style", "solid");gv::setv($N, "color", "black");gv::edge($cluster1, 'b0', 'b1'); //line 12gv::edge($cluster1, 'b1', 'b2'); //line 12gv::edge($cluster1, 'b2', 'b3'); //line 12gv::setv($cluster1, "label", "process #2"); // line 13gv::setv($cluster1, "color", "blue"); // line 14 $node_start = gv::node($g, 'start');gv::setv($node_start, "shape", "Mdiamond");$node_end = gv::node($g, 'end');gv::setv($node_end, "shape", "Msquare");gv::edge($g, 'start', 'a0'); //line 16gv::edge($g, 'start', 'b0'); //line 17gv::edge($g, 'a1', 'b3'); //line 18gv::edge($g, 'b2', 'a3'); //line 19gv::edge($g, 'a0', 'a3'); //line 20gv::edge($g, 'a3', 'end'); //line 21gv::edge($g, 'b3', 'end'); //line 22gv::layout($g, 'dot');gv::render($g, 'png', 'graph1.png');gv::rm($g);echo '<img src="graph1.png">';
?></html>界面效果如下：
DOT语言代码如下：
digraph G { subgraph cluster0 { node [style=filled,color=white]; style=filled; color=lightgrey; a0 -> a1 -> a2 -> a3; label = "process #1"; } subgraph cluster1 { node [style=filled]; b0 -> b1 -> b2 -> b3; label = "process #2"; color=blue } start -> a0; start -> b0; a1 -> b3; b2 -> a3; a3 -> a0; a3 -> end; b3 -> end; start [shape=Mdiamond]; end [shape=Msquare];
}