基于Matlab若干经典算法的可视化研究

湖南科技学院 王 涛 韩 芹 文 博 吴子凌

1.引言

随着信息的增长和社会的发展，可视化技术有着越来越重要的意义。通过可视化技术可以清晰快速地获取信息和知识，并更有助于学生的思考。可视化教育已经成为一个新兴的研究领域[1]。在大学的课程中，算法课程是属于比较抽象、复杂的课程，又是计算机专业的一门实践性和综合性很强的核心课程。为了在有限的课堂教学能获得更好的教学效果，提高学生学习算法的积极性和主动性，本文采用了MATLAB软件的GUI工具设计并实现了一套若干经典算法的可视化教学平台，有助于学生对于算法的理解与应用，提高教学质量。

2.建立算法可视化功能模型

通过对学习《数学建模》、《算法设计与分析》、《数据结构》等专业核心课程的学生和教授这些课程的老师分别进行了调研，了解哪些算法对于学生来说学习时理解过于困难，而对于老师而言哪些算法在课堂上讲解时效果不是很理想。结合这两个方面，本系统选取了深度优先搜索算法、广度优先搜索算法、Dijkstra算法、Prim算法、堆排序算法、快速排序算法、KMP算法、二分查找算法、动态规划算法、BP神经网络算法十个经典、有代表性的、难以理解的算法进行可视化研究。其中，每个算法作为一个模块单独进行设计，每个算法模块包括的功能有算法简介、算法分析、代码实现、动画演示、练习与提高和实际应用。

3.面向对象的GUI设计流程

Matlab中的GUIDE功能包括进行GUI面板设计和GUI组件回调程序编程。用户只需通过鼠标将对象拖拽到目的区域即可快速地构建出GUI[2]。本文利用图形用户界面开发环境GUIDE，方便、快捷地创建了算法可视化平台的GUI。该平台既能向用户展示算法的思想和方法，又能将算法分析过程以人机交互的动态方式演示出来，具有界面友好、操作简单的特点。

GUI设计流程如下：（1）分析功能需求，明确设计任务。（2）绘出基本的用户界面草图，从学生和教师的角度进行审查。（3）打开MATLAB软件，点击工具栏中的GUIDE，制作GUI用户操作界面。（4）添加所需控件，利用属性编辑对话框进行属性设置，完成界面的布局。（5）添加控件的回调函数，点击运行，生成所需界面GUI，保存在FIG和M文件中[3]。

4.算法可视化平台的实现

4.1 算法可视化平台主界面

用户进入主界面就能一目了然的看到十个经典算法目录。每个算法对应一个按钮，用户只需点击各个算法的按钮即可进入到相应的算法可视化子界面。该界面主要由GUIDE工具集中的按钮、坐标轴、静态文本框等控件实现。在Matlab命令窗口中输入GUIDE，打开界面编辑器（Layout Editor），从界面编辑器的左侧控件中，选择1个坐标轴（Axes）控件，1个文本标签（Static Text）控件，10个按钮(Push Button)控件，通过布置这些控件的位置和设置它们的属性，完成主界面的设计。

4.2 算法可视化平台子界面

本文以深度优先搜索算法子界面为例，说明其主要功能和实现方法。用户点击“深度优先搜索算法”按钮就进入到如图1所示的子界面。子界面包括算法简介、算法分析、代码实现、动画演示、练习与提高以及实际应用6个按钮，其设计过程与主界面的设计过程是类似的。用户点击“算法简介”按钮就会进入算法主要思想的显示界面。其实现步骤如下：（1）首先将元件Axes平铺于底部作为背景图片，接着调整相应检查器的OuterPosition设置其属性值，使背景图片以居中的效果显示。（2）标题栏的设置。使用元件Static text，调整BackgroudColor的属性，使显示效果与背景更相符合。（3）文字面板的设置。以元件Panel作为面板部分，将元件Editable text覆盖其上，文字部分的主体将显示其中。（4）返回功能按钮的制作。使用元件Button，重写相应检查器中的Title属性，并编写Callback函数，实现页面跳转功能。

图1 深度优先搜索算法子模块界面

用户了解了算法的思想后，点击“算法分析”按钮进入算法分析界面查看算法实现的具体步骤，点击“代码实现”按钮可以查看算法范例的程序代码实现。为了进一步加深对算法的理解，用户可以点击“练习与提高”按钮，针对给出的习题进行练习。同时，对于所学的算法如何学以致用，用户还可以点击“实际应用”按钮进入相应界面，开阔视野，提高实际应用的能力。上述界面与算法简介界面使用的控件和实现步骤都是相类似的。不同在于，每个界面对应显示的文本内容不同而已。

本文具有特色的设计是实现了算法的动画演示，有助于学生对于算法的理解与应用。用户点击“动画演示”按钮进入到如图2所示界面。用户在观看动画演示时可以通过点击前进、后退、暂停等按钮对算法实现的过程可以看得更为清楚，理解得更为透彻。

图2 动画演示

本文采用Flash动画与MATLAB相结合来实现算法动画演示功能。实现具体步骤如下：（1）使用Photoshop对图像素材进行优化处理。（2）分析对象的构成及动态对象包括位移，节点和线段颜色的变化等，设置图层的层叠关系。（3）设置场景舞台的版面大小，把背景色设置为绿色，动画以13帧播放效果最佳，将之前准备的素材文件逐一导入元件库中。（4）利用补间动画原理制作中间各帧，从而使动画从一个关键帧自然过渡到另外一个关键帧。这里主要通过元素文字的移动变化来体现的。（5）通过在不同按钮上定义不同的动作脚本来控制动画的运行状态[4]，如：在停止的按钮上输入：on (release) {_root.mc.stop();}；在快退的按钮上输入：on(release) {_root.mc.prevFrame();}表示回到动画的上一桢；在快进的按钮上输入：on (release) {_root.mc.nextFrame(); }。

5.结语

本文利用Matlab软件开发了一款包含十种经典的、具有代表性的算法可视化平台。用户通过该平台不仅可以了解这十种算法的具体思想、实现步骤和实际应用，还可以通过动画演示的方式学习和掌握算法的实现过程。该平台打破了传统学习算法的方式让算法真正的“动起来”，同时也推进了讨论式教学、案例教学、网课等教学方法和合作式教学方式，提高学生自主学习和独立研究的能力。

[1]唐棣,郭禾.计算机图形学算法可视化教学研究与实践[J].电化教育研究,2009(01):93-98.

[2]秦襄培.MATLAB图像处理与界面编程宝典[M].北京:电子工业出版社,2009.

[3]罗华飞.MATLAB GUI设计学习手记[M].北京:北京航空航天大学出版社,2011.

[4]余雨.算法可视化软件设计中关键问题的研究[D].安徽理工大学,2016.