数据结构学习工具总结

图解程序员画流程图、数据结构图及各种复杂图形的Graphviz工具入门

http://blog.csdn.net/jin13277480598/article/details/51305674
安装Graphviz
如何使用Graphviz
1 学习官方例程
2查看例程源代码
3建立工程输出图像


我们画常规图形时一般用word上面自带的插件或visio画图。但是我在画linux内核文件系统结构图、内


存分配以及学习数据结构树、图时，发现使用Graphviz非常的方便快捷。鉴于网上关于它的安装、使用


不是特别具体，本博文将一步步告诉大家如何快速地使用Graphviz画相关的流程图、树形图等。


1.安装Graphviz
在官网上面下载相关文件，地址：http://www.graphviz.org/Download..php。如果遇到官网进不去，可


以等待一旦时间或者在网上直接搜索下载。


Linux安装命令为sudo apt-get install graphviz 。下面以Windows为例:


点击进入之后，下载后缀为.msi的文件。笔者下载的为graphviz-2.38.msi.


特别说明：安装完毕，在桌面可能不会出现快捷方式，不要以为自己没有安装成功。这时候我们可以在


安装源目录里面找出来或者在所有程序里面把它搜索出来。建议第一种方法找到之后，右键建立快捷方


式。


点击 gvedit.exe之后出现这个界面，其中那个跑步的为运行按钮


2. 如何使用Graphviz
2.1 学习官方例程
为了方便大家之后能够快速入门，这里我采用官网上面的源代码，官网上面例子很多。大家可以按需学


习。例程官网地址：http://www.graphviz.org/Gallery.php


2.2查看例程源代码
这里以第二个例程源代码crazy为例，先点击图片进入。


之后可以看到指示，点击图片即可看见到源代码。


2.3建立工程，输出图像
先点击最左侧像书页的图标，在GVEdit上面的新建.gv文件，将上面获取的代码，粘贴进去，点击跑步按


钮，即可生成所需图像。


附带一个简单的小例子，便于大家测试：


源代码：


digraph 1{


  node[shape="record"];


  edge[style="dashed"];


  a[style="filled",color="red",fillcolor="chartreuse"];


  b;


  c;


  d;


  a ->b;


  b ->d;


  c ->d[color="green"];


        d-> a;


}


到这里之后，如下的就是自己发挥空间，自己可以根据上面官网提供的代码进行学习。官网上面一些常


见的图形都涉及都了，其他的结合dot脚步语言学习。


3.      参考资料
网上很多资料，这里笔者推荐Graphviz中文教程指南,网上有下载，CSDN上面下载地址：


http://download.csdn.net/download/u010415192/9219945
========

图形化的各种数据结构模拟软件

http://download.csdn.net/download/newstudent_never/4550973
========

旧金山大学数据结构和算法的可视化学习工具

http://hao.jobbole.com/visualizing-algorithms-and-data-structure/
数据结构 , 旧金山大学 , 算法 3


理解复杂数据结构的最佳方法就是看它们的实际操作。旧金山大学计算机系的助理教授  David Galles  


在 2011 年开发了一套用于学习数据结构和算法的交互工具。这个可视化工具是用 JavaScript 编写，


用上了 HTML5 画布元素，兼容所有现代浏览器。iPhone 和 iPad 等 iOS 设备和 Kindle 上的浏览器都


支持。


（编注：建议在非手机设备上使用，这个工具并不是自适应的，屏幕过小不利于操作和查看。）


如何使用


以链表队列为例，进入网页后，上方有一个操作按钮的工具栏。最左侧可输入队列元素，然后进行入队


（Enqueue）和出队（Dequeue）操作。


下方是另外一个操作按钮的工具栏，用于设置动画参数等操作。


Visualizing Algorithms


 其他


这个工具的源码已公开，感兴趣的计算机课程教师，请参阅这个网页，然后可基于 David 的代码编写自


己的教程动画。


 官方网站：http://www.cs.usfca.edu/~galles/visualization/Algorithms.html
========