程序员学算法和数据结构时,如果从纯文本和静态图来学,挺枯燥的。
相反,可视化动画工具,真是一个非常棒的帮手。这类工具/网站,我们曾介绍过 3 个:
旧金山大学数据结构和算法的可视化学习工具
http://hao.jobbole.com/visualizing-algorithms-and-data-structure/
VisuAlgo:通过动画学习算法和数据结构
http://hao.jobbole.com/visualgo/
Algomation:查看、创建和分享算法的学习平台
今天我们发现一个同类型的新网站 Algorithm Visualizer,做得很好。
网址是:http://algorithm-visualizer.org
![](https://img.haomeiwen.com/i15014728/10eac61fdbbda90e.png)
下面通过冒泡排序,大概解释一下 Algorithm Visualizer 这个工具:
![](https://img.haomeiwen.com/i15014728/06abe3f2e53a64f9.png)
①、选择区
汇总了好多:回溯法、加密算法、动态规划、图搜索、贪婪算法、搜索算法、排序算法等
![](https://img.haomeiwen.com/i15014728/cc14f3de6f0b93d7.png)
② ChartTracer
长条图方式展示每次交换的过程。每次交换位置的两个数,对应的长条会红色高亮。
![](https://img.haomeiwen.com/i15014728/5bba9bd66b1d5f2f.png)
③ Array1DTracer
作用和②类似
![](https://img.haomeiwen.com/i15014728/62d375c3fa8e6ab8.png)
④ LogTracer
日志模式记录每次 swap 的过程
![](https://img.haomeiwen.com/i15014728/63893b1a65a4808a.png)
⑤ 工具栏
开始/暂停/下一步/上一步
![](https://img.haomeiwen.com/i15014728/1b7f369c7e603111.png)
⑥
这块是定义这个算法的一些相关基本信息。里面的 ChartTracer、Array1DTracer、LogTracer,对应上方的 ②③④。数组大小为 15。
![](https://img.haomeiwen.com/i15014728/a59941e44569edf9.png)
如果你是看加密算法的演示过程,那 ⑥ 这里就是展示加密算法的一些基本信息。
⑦ 核心算法
![](https://img.haomeiwen.com/i15014728/169141b2a0921532.png)
Algorithm Visualizer 在 GitHub 有 10.6k+ Star:
https://github.com/algorithm-visualizer/algorithm-visualizer
网友评论