graphviz的包 python graphviz使用

GraphViz 图形工具使用教程综合篇

• GraphViz简述
• GraphViz基本元素

• 生成一个有向图
• node属性、edit属性和subgraph的使用

• 如何安装GraphViz
• GraphViz工具

• dot命令行调用
• 配置Sublime支持图片预览
• web端在线生成图片
• 桌面端应用

• 其他图象化工具

• 在线绘图工具

• 延展阅读

GraphViz简述

GraphViz是一个使用DOT编程语言生成有向图，无向图等图象的工具。 如果只是偶尔使用，可以在本地先定义好关系，使用web浏览器在线生成关系图。

GraphViz基本元素

• (N) node 节点
• (E) edge 线
• (G) graph 图
• (S) subgraph 子图
• © cluster subgraphs 子图群

生成一个有向图

第一步，定义关系如下：

总部->{市场营销部;财务部;人力行政部;技术部;}
技术部->{后端开发;前端开发;运维;}
市场营销部->{线下营销; 线上营销}

第二步，给定义好的关系起个名字，一个有向图定义完成

digraph 组织架构{
总部->{市场营销部;财务部;人力行政部;技术部;}
技术部->{后端开发;前端开发;运维;}
市场营销部->{线下营销; 线上营销}
}

组织架构，函数调用，物流追踪，网络追踪，审批流程等有向操作，只需要用"->"定义节点之间的关系，便可以生成其关系图。

复杂的节点关系用graphviz生成图可更直观地观察节点之间的关系。

node属性、edit属性和subgraph的使用

digraph {
	bgcolor="#EEEEEE";

	node [shape="box"];
	a[shape="ellipse", color="red"];
	b[fontcolor="#55AA55", style="dotted"];
	c[style="invis"];
	d[style="filled" color="#F9B34B"];
	stract_z[shape="record", label="<f1> 第一列|{<f21> 第二列-行| <f22> 第二列二行}|<f3> 第三列"];

	a->stract_z:f21;
	b->stract_z:f22[style="dotted", color="#55AA55"];
	a->c[headclip=false, arrowhead="none"];
	c->d[tailclip=false];
	d->sa:sa01;

	subgraph cluster_a {
		label="定义的一个子图";
		style="rounded"
		sa[shape="record", label="{{<sa01> 001 | <sa02> 002}|<sa1> sa1| <sa2> sa2}"];
		sa:sa1->sb;
		sa:sa2->sc;
	}

	{rank="same"; stract_z; d}
}

上面的例包含了常用的定义node节点内容和样式和颜色， edge样式和颜色，隐藏node，子图，PORT链接点和节点同级。

总得来说，用GraphViz画有向图只需要定义节点和节点关系即可，样式等其他无关紧要的东西并不常用，可慢慢调整。

如何安装GraphViz

GraphViz支持Linux , Windows , Mac系统平台 。如mac用brew安装

brew install graphviz

Linux , Windows 平台到官方网站找相应的安装包。

下载地址： http://www.graphviz.org/download/

GraphViz工具

GraphViz支持的命令有

• dot − filter for drawing directed graphs
• neato − filter for drawing undirected graphs
• twopi − filter for radial layouts of graphs
• circo − filter for circular layout of graphs
• fdp − filter for drawing undirected graphs
• sfdp − filter for drawing large undirected graphs
• patchwork − filter for squarified tree maps
• osage − filter for array-based layouts

本文讲述dot有向图的使用

dot命令行调用

// dot -Tpng -o a.png a.dot && open a.png
dot -Tpng -o a.png a.dot

配置Sublime支持图片预览

此安装方式，需要Sublime已经安装了Package Control

• command+shift+p打开命令面板
• package install GraphvizPreview
  安装成功后，按快捷control+shift+g 便可为当前打开的dot文件生成预览图

精通sublime的话，可以自已配置Build System的方式实现生成图片

web端在线生成图片

在线生成有向图：http://graphviz.herokuapp.com/ 你也可以搭建自己专用的webgraph编辑器，git仓库地址：

https://github.com/Potherca/GraphvizWebEditor

克隆到网站目录下执行composer install便可以使用。

桌面端应用

DotEditor

其他图象化工具

• PlantUML - 时序图，用例图，类图，组件图，等程序架构图绘制工具（PlantUML可以以jar包的方式运行，底层调用GraphViz生成图象）
• D3 vs G2 vs Echarts - javascript前端绘图工具
• Neo4j - NOSQL图形数据库
• Xmind - 脑图工具

在线绘图工具

• ProcessOn https://www.processon.com/
• 百度脑图 http://naotu.baidu.com/
• draw.io https://www.draw.io/
• Zen Flowchart http://www.zenflowchart.com/
• https://www.gliffy.com/