【图形描述语言】Graphviz Dot

本系列介绍文本转图片工具支持的图形描述语言。图形描述语言将图片描述为代码或者文本，有利于版本管理，很适合嵌入 LaTeX 或 Markdown 文档。用于网站时，还可以减轻图片存储压力，因为图片可以根据代码在使用时生成。本文是该系列第六篇，介绍 Graphviz Dot 语言。

Contents

1 概述
2 语法
3 节点和边
4 Graphviz画廊

概述

Graphviz 是一款开源图形可视化软件。图可视化是将结构信息表示为抽象图和网络图的一种方法。它在网络、生物信息学、软件工程、数据库和网页设计、机器学习以及其他技术领域的视觉界面方面有重要的应用。

Graphviz 布局程序以简单的文本语言描述图形，并以有用的格式(如 web 页面的图像和 SVG)生成图形；PDF 或 Postscript，以供加入其他文件；或显示在交互式图形浏览器中。Graphviz 对于具体图有许多有用的特性，例如颜色、字体、表格节点布局、行样式、超链接和自定义形状的选项。

Graphviz 有 6 个引擎，分别是：

dot - “层次”或有向图的分层绘图。如果边具有方向性，这是默认使用的工具。
neato - “spring model” 布局。如果图不是太大(大约 100 个节点)，而且您对它一无所知，那么这是默认的工具。Neato 试图最小化一个全局能量函数，它相当于统计多维尺度。
fdp - “spring model”的布局类似于neato，但它是通过减少力而不是利用能量来实现的。
sfdp - fdp 的多尺度版本，用于大图形的布局。
twopi - 径向布局，after Graham Wills 97。节点被放置在同心圆上，这取决于它们与给定根节点的距离。
circo - 圆形布局，after Six and Tollis 99, Kauffman and Wiese 02。这适用于多个循环结构的某些图，例如某些电信网络。

Graphviz 内容较多，本文仅简单介绍其语法，更多内容请参考 Graphviz 文档。

语法

图形类型

无向图

使用关键词 graph 开始，连接线用 --。

graph graphname {
     a -- b -- c;
     b -- d;
 }

有向图

使用关键词 digraph 开始，连接线用 ->。

digraph graphname {
     a -> b -> c;
     b -> d;
 }

属性

DOT语言中，可以对节点和边添加不同的属性。这些属性可以控制节点和边的显示样式，例如颜色，形状和线形。可以在语句和句尾的分号间放置一对方括号，并在其中中放置一个或多个属性-值对。多个属性可以被逗号和空格（, ）分开。节点的属性被放置在只包含节点名称的表达式后。

graph graphname {
     // label属性可以改变节点的显示名称
     a [label="Foo"];
     // 节点形状被改变了
     b [shape=box];
     // a-b边和b-c边有相同的属性
     a -- b -- c [ color=blue];  
     b -- d [style=dotted];
 }

子图

需使用 subgraph 开始，并且子图名称以 cluster_ 开头，如下：

digraph G {

        subgraph cluster_0 {
                style=filled;
                color=lightgrey;
                node [style=filled,color=white];
                a0 -> a1 -> a2 -> a3;
                label = "process #1";
        }

        subgraph cluster_1 {
                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];
}

节点和边

多边形节点

digraph G{
box [shape=box];
polygon [shape=polygon];
ellipse [shape=ellipse];
oval [shape=oval];
circle [shape=circle];
point [shape=point];
egg [shape=egg];
triangle [shape=triangle];
plaintext [shape=plaintext];
plain [shape=plain];
diamond [shape=diamond];
trapezium [shape=trapezium];
parallelogram [shape=parallelogram];
house [shape=house];
pentagon [shape=pentagon];
hexagon [shape=hexagon];
septagon [shape=septagon];
octagon [shape=octagon];
doublecircle [shape=doublecircle];
doubleoctagon [shape=doubleoctagon];
tripleoctagon [shape=tripleoctagon];
invtriangle [shape=invtriangle];
invtrapezium [shape=invtrapezium];
invhouse [shape=invhouse];
Mdiamond [shape=Mdiamond];
Msquare [shape=Msquare];
Mcircle [shape=Mcircle];
rect [shape=rect];
rectangle [shape=rectangle];
square [shape=square];
star [shape=star];
none [shape=none];
underline [shape=underline];
cylinder [shape=cylinder];
note [shape=note];
tab [shape=tab];
folder [shape=folder];
box3d [shape=box3d];
component [shape=component];
promoter [shape=promoter];
cds [shape=cds];
terminator [shape=terminator];
utr [shape=utr];
primersite [shape=primersite];
restrictionsite [shape=restrictionsite];
fivepoverhang [shape=fivepoverhang];
threepoverhang [shape=threepoverhang];
noverhang [shape=noverhang];
assembly [shape=assembly];
signature [shape=signature];
insulator [shape=insulator];
ribosite [shape=ribosite];
rnastab [shape=rnastab];
proteasesite [shape=proteasesite];
proteinstab [shape=proteinstab];
rpromoter [shape=rpromoter];
rarrow [shape=rarrow];
larrow [shape=larrow];
lpromoter [shape=lpromoter];

box->polygon->ellipse->oval->circle->point->egg;
triangle->plaintext->plain->diamond->trapezium->parallelogram->house;
pentagon->hexagon->septagon->octagon->doublecircle->doubleoctagon->tripleoctagon;
invtriangle->invtrapezium->invhouse->Mdiamond->Msquare->Mcircle->rect;
rectangle->square->star->none->underline->cylinder->note;
tab->folder->box3d->component->promoter->cds->terminator;
utr->primersite->restrictionsite->fivepoverhang->threepoverhang->noverhang->assembly;
signature->insulator->ribosite->rnastab->proteasesite->proteinstab;
rpromoter->rarrow->larrow->lpromoter;    
}

digraph G{
box [shape=box];
polygon [shape=polygon];
ellipse [shape=ellipse];
oval [shape=oval];
circle [shape=circle];
point [shape=point];
egg [shape=egg];
triangle [shape=triangle];
plaintext [shape=plaintext];
plain [shape=plain];
diamond [shape=diamond];
trapezium [shape=trapezium];
parallelogram [shape=parallelogram];
house [shape=house];
pentagon [shape=pentagon];
hexagon [shape=hexagon];
septagon [shape=septagon];
octagon [shape=octagon];
doublecircle [shape=doublecircle];
doubleoctagon [shape=doubleoctagon];
tripleoctagon [shape=tripleoctagon];
invtriangle [shape=invtriangle];
invtrapezium [shape=invtrapezium];
invhouse [shape=invhouse];
Mdiamond [shape=Mdiamond];
Msquare [shape=Msquare];
Mcircle [shape=Mcircle];
rect [shape=rect];
rectangle [shape=rectangle];
square [shape=square];
star [shape=star];
none [shape=none];
underline [shape=underline];
cylinder [shape=cylinder];
note [shape=note];
tab [shape=tab];
folder [shape=folder];
box3d [shape=box3d];
component [shape=component];
promoter [shape=promoter];
cds [shape=cds];
terminator [shape=terminator];
utr [shape=utr];
primersite [shape=primersite];
restrictionsite [shape=restrictionsite];
fivepoverhang [shape=fivepoverhang];
threepoverhang [shape=threepoverhang];
noverhang [shape=noverhang];
assembly [shape=assembly];
signature [shape=signature];
insulator [shape=insulator];
ribosite [shape=ribosite];
rnastab [shape=rnastab];
proteasesite [shape=proteasesite];
proteinstab [shape=proteinstab];
rpromoter [shape=rpromoter];
rarrow [shape=rarrow];
larrow [shape=larrow];
lpromoter [shape=lpromoter];

box->polygon->ellipse->oval->circle->point->egg;
triangle->plaintext->plain->diamond->trapezium->parallelogram->house;
pentagon->hexagon->septagon->octagon->doublecircle->doubleoctagon->tripleoctagon;
invtriangle->invtrapezium->invhouse->Mdiamond->Msquare->Mcircle->rect;
rectangle->square->star->none->underline->cylinder->note;
tab->folder->box3d->component->promoter->cds->terminator;
utr->primersite->restrictionsite->fivepoverhang->threepoverhang->noverhang->assembly;
signature->insulator->ribosite->rnastab->proteasesite->proteinstab;
rpromoter->rarrow->larrow->lpromoter;    
}

Record-based 节点

digraph structs {
    node [shape=record];
    struct1 [label="<f0> left|<f1> mid\ dle|<f2> right"];
    struct2 [label="<f0> one|<f1> two"];
    struct3 [label="hello\nworld |{ b |{c|<here> d|e}| f}| g | h"];
    struct1:f1 -> struct2:f0;
    struct1:f2 -> struct3:here;
}

节点风格

The style attribute can be used to modify the appearance of a node. At present, there are 8 style values recognized: filled, invisible, diagonals, rounded. dashed, dotted, solid and bold. As usual, the value of the style attribute can be a comma-separated list of any of these. If the style contains conflicts (e.g, style="dotted, solid"), the last attribute wins.

digraph G {
  rankdir=LR
  node [shape=box, color=blue]
  node1 [style=filled] 
  node2 [style=filled, fillcolor=red] 
  node0 -> node1 -> node2
}

digraph R {
  rankdir=LR
  node [style=rounded]
  node1 [shape=box]
  node2 [fillcolor=yellow, style="rounded,filled", shape=diamond]
  node3 [shape=record, label="{ a | b | c }"]

  node1 -> node2 -> node3
}

箭头形状

箭头相关属性有 arrowhead，arrowtail，dir，penwidth 等。以下是一个例子。

digraph G{
    rankdir=TB;
    a->b[arrowhead=box,dir=both,arrowtail=diamond,label="both"];
    a->c[arrowhead=box,dir=forward,arrowtail=diamond,label="forward"];
    a->d[arrowhead=box,dir=back,arrowtail=diamond,label="back"];
    a->e[arrowhead=box,dir=none,arrowtail=diamond,label="none",penwidth=8];
}

基本形状

基本形状有 11 个，分别是 box,crow,curve,icurve,diamond,dot,inv,none,normal,tee,vee。示例代码如下：

digraph G{
    rankdir=LR;
a->box [arrowhead=box];
a->crow [arrowhead=crow];
a->curve [arrowhead=curve];
a->icurve [arrowhead=icurve];
a->diamond [arrowhead=diamond];
a->dot [arrowhead=dot];
a->inv [arrowhead=inv];
a->none [arrowhead=none];
a->normal [arrowhead=normal];
a->tee [arrowhead=tee];
a->vee [arrowhead=vee];
}

扩展形状

配合修饰词（modifiers），还可以扩展出很多形状。有如下修饰词:

l - 裁剪形状，只留下边缘左边的部分。
r - 裁剪形状，只留下边缘右侧的部分。
o - 使用形状的开放(非填充)版本。

示例如下：

digraph G{
    rankdir=LR;
a->box [arrowhead=box];
a->lbox [arrowhead=lbox];
a->rbox [arrowhead=rbox];
a->obox [arrowhead=obox];
a->olbox [arrowhead=olbox];
a->orbox [arrowhead=orbox];
}

颜色

参见官方文档。

Graphviz画廊

以上就是全部内容，欢迎到文本转图片工具试用。

知行近思

知行合一，切问近思

【图形描述语言】Graphviz Dot

概述

语法

图形类型

无向图

有向图

属性

子图

节点和边

多边形节点

Record-based 节点

节点风格

箭头形状

基本形状

扩展形状

颜色

Graphviz画廊

发表回复取消回复

概述

语法

图形类型

无向图

有向图

属性

子图

节点和边

多边形节点

Record-based 节点

节点风格

箭头形状

基本形状

扩展形状

颜色

Graphviz画廊

相关文章:

发表回复 取消回复

发表回复取消回复