基于Web的通信工程專業(yè)開源交互式可視化教學(xué)實(shí)驗(yàn)平臺(tái)研究

[摘 要] 研究通信工程專業(yè)基于web的開源交互式可視化教學(xué)實(shí)驗(yàn)平臺(tái)，可為后期將此單一研究成果擴(kuò)展為模板化、標(biāo)準(zhǔn)化的用戶接口提供技術(shù)支撐。此平臺(tái)廣泛適用于高等學(xué)校理工類專業(yè)學(xué)生的交互式、可視化教學(xué)實(shí)驗(yàn)及案例分析。通過研究分析，教學(xué)實(shí)驗(yàn)平臺(tái)可靈活提供大量仿真參數(shù)改變操作以及對(duì)應(yīng)結(jié)果變化的可視化演示。此研究成果為開源平臺(tái)，web前端不需要其他軟件的支撐和用戶注冊(cè)，任何支持web瀏覽的設(shè)備都可進(jìn)入教學(xué)實(shí)驗(yàn)平臺(tái)并進(jìn)行感興趣的操作和結(jié)果演示。此成果將有助于提高學(xué)生學(xué)習(xí)的主觀能動(dòng)性，不再是“填鴨式”、記憶式的教學(xué)，注重理論與實(shí)踐相結(jié)合。

[關(guān)鍵詞] 通信工程;Web;開源;可視化

[基金項(xiàng)目] 2019年度宜春學(xué)院“六卓越一拔尖2.0”人才培養(yǎng)計(jì)劃項(xiàng)目“面向‘OBE的通信工程課程體系構(gòu)建與持續(xù)改進(jìn)機(jī)制”;2019年度宜春學(xué)院一流課程（“金課”）項(xiàng)目“通信原理”;2019年度宜春學(xué)院教學(xué)改革研究課題“基于Web新工科的通信電子專業(yè)開源交互式可視化教學(xué)研究”（YCUJG-2019-15）;2020年度江西省教育廳科技重點(diǎn)項(xiàng)目“面向5G+車聯(lián)網(wǎng)陣列天線自適應(yīng)波束成形定位技術(shù)研究”（GJJ201601）;2020年度教育部產(chǎn)學(xué)合作協(xié)同育人項(xiàng)目“賦能新工科，校企融合共建現(xiàn)代通信工程課程體系”（202002118054）

[作者簡(jiǎn)介] 虞貴財(cái)（1977—），男，江西撫州人，博士，宜春學(xué)院物理科學(xué)與工程技術(shù)學(xué)院副教授，主要從事車輛通信、MIMO通信技術(shù)、無線傳感器網(wǎng)絡(luò)。

[中圖分類號(hào)] G642.4;TN91-4? [文獻(xiàn)標(biāo)識(shí)碼] A? ?[文章編號(hào)] 1674-9324（2021）44-0154-04? ?[收稿日期] 2020-03-13

一、引言

工程、數(shù)學(xué)、科技類專業(yè)中的很多概念通過單一的課堂講授方式晦澀難懂，如電子通信類，無線電是看不見、摸不著但現(xiàn)實(shí)又存在的，信號(hào)是如何傳輸接收的，等等。如果通過圖形和圖像可視化的方式進(jìn)行講授，有些概念將更容易理解?？梢暬沟秒y以準(zhǔn)確掌握和傳達(dá)的信息能夠采用啟發(fā)式的方式進(jìn)行傳授，這些在高等教育中顯得非常重要，特別是理工科技類專業(yè)。這些課程的內(nèi)容如果采用交互式的方法展現(xiàn)將顯得非常有啟發(fā)性。學(xué)生學(xué)習(xí)理論知識(shí)的同時(shí)，可通過改變仿真參數(shù)而得到相應(yīng)的仿真結(jié)果變化，明確某些參數(shù)的實(shí)際物理意義[1]。

結(jié)合Web技術(shù)的仿真可視化教學(xué)平臺(tái)組成的架構(gòu)和仿真程序可成為開源可接入界面。前期Masson等專門針對(duì)電子工程專業(yè)設(shè)計(jì)建設(shè)了相關(guān)的Web仿真平臺(tái)[2]，雖然此成果的有些技術(shù)仍然可用，但是隨著科學(xué)技術(shù)和教學(xué)發(fā)展，一些技術(shù)已經(jīng)過時(shí)，應(yīng)該從用戶體驗(yàn)、界面友好性和操作靈活性方面進(jìn)行更新、提高。文獻(xiàn)[3]給出了一種單一功能的Web仿真平臺(tái)，文獻(xiàn)[4]介紹了電子仿真設(shè)備的Web前端設(shè)計(jì)。后期也有電子設(shè)備和電路特性仿真的研究，雖然可以對(duì)任意模型進(jìn)行仿真，但屬性比較單一，而且用戶操作界面依賴上傳的文本文件，在學(xué)生掌握仿真核心技術(shù)層面的普適性和通用性上受到質(zhì)疑。文獻(xiàn)[5]給出了一種高通用性的基于Web nanoHUB的平臺(tái)，此平臺(tái)支持不同程序語言和仿真工具，但是需要在客戶端安裝Java和用戶注冊(cè)，因此平臺(tái)并非完全開源。本課題介紹了一種交互式、基于Web的可視化仿真教學(xué)演示平臺(tái)框架。此平臺(tái)計(jì)劃用于電子工程類通信專業(yè)本科生和研究生的教學(xué)科研演示平臺(tái)。任何學(xué)生和個(gè)人不需要注冊(cè)就可以訪問。平臺(tái)采用開源軟件設(shè)計(jì)并完成，用戶只需具備JavaScript就可以瀏覽，不需要安裝額外的插件。同時(shí)，在此平臺(tái)上創(chuàng)建新的Webdemo很簡(jiǎn)單，不需要掌握Web編程知識(shí)。因此，教師和學(xué)生很容易使用并掌握此教學(xué)演示平臺(tái)。

二、Webdemo教學(xué)演示平臺(tái)框架

Web教學(xué)演示平臺(tái)允許訪問用戶通過Web瀏覽器創(chuàng)建交互式可視化的仿真工具，Web演示平臺(tái)包括許多交互式和可描述頁面，頁面間雖然按一定順序互相關(guān)聯(lián)，但它們?nèi)匀豢梢酝ㄟ^自動(dòng)形成的內(nèi)容列表被隨機(jī)地訪問、接入。平臺(tái)框架可用于不同訪問接入人員，包括教職工、學(xué)生和其他機(jī)構(gòu)的第三人。訪問不需要Web編程技術(shù)，然而Webdemo操作者需要掌握基本的科學(xué)程序語言知識(shí)，如Matlab、GNU Octave、Pythons Scipy等軟件的數(shù)據(jù)庫編程，這些軟件可用于數(shù)值仿真。Webdemo框架可以分為四個(gè)組成部分，如圖1所示。

（一）動(dòng)態(tài)模板系統(tǒng)

Webdemo框架的重要組成部分是用PHP編寫的模板系統(tǒng)。此系統(tǒng)創(chuàng)建web頁面，傳遞客戶端（Webdemo用戶）信息。系統(tǒng)對(duì)所有Webdemo用戶來說都具有相同的體驗(yàn)。如圖1所示，動(dòng)態(tài)模板系統(tǒng)包括三部分，即模型（model： M）、查看（view： V）和控制器（Controller）。

（二）仿真核心組件

在客戶端上執(zhí)行計(jì)算，允許用戶輸入提示響應(yīng)，一旦Web界面的模擬仿真已加載，不需要與服務(wù)器進(jìn)行進(jìn)一步通信溝通，因此沒有發(fā)生傳輸時(shí)間的延遲。然而，用于執(zhí)行所需計(jì)算的軟件是由用戶計(jì)算機(jī)配置決定的，大多數(shù)互聯(lián)網(wǎng)用戶的瀏覽器支持JS使用特殊程序庫繪制數(shù)據(jù)圖。然而，這些程序庫并不提供科學(xué)軟件所具備的數(shù)學(xué)運(yùn)算和圖形輸出專用功能特性。此外，現(xiàn)有的仿真模型重復(fù)使用局限于JS，用戶不會(huì)面臨需要安裝其他軟件的煩瑣工作。用戶可能由于軟件的許可證限制、用戶硬件或操作系統(tǒng)的不兼容而無法使用該軟件。

Webdemo框架的主要目的是，通過提供實(shí)際案例，讓學(xué)生熟悉使用科學(xué)軟件和仿真模型，他們可以即時(shí)學(xué)習(xí)Webdemo，也可以通過檢查底層的仿真腳本源代碼有更詳細(xì)的理解。為了使每個(gè)人都能使用源代碼，應(yīng)提供免費(fèi)的編碼器或解碼器。此外，它應(yīng)該有大量的計(jì)算機(jī)平臺(tái)和操作系統(tǒng)。因此，GNU Octave因?yàn)殚_源和強(qiáng)大的內(nèi)置可視化程序以及向量代數(shù)運(yùn)算、濾波器、變換功能被選定作為仿真軟件。使用Octave編寫的仿真腳本與外部程序庫獨(dú)立，程序源碼長(zhǎng)度方面應(yīng)保持緊湊特點(diǎn)，方便用戶編輯部署和易于理解。每一個(gè)Webdemo具備各自的Octave功能，可供下載和運(yùn)行。此外，Octave很大程度上與商業(yè)軟件Matlab兼容。因此，使用Octave開發(fā)的Webdemo仿真腳本基本上可以在Matlab操作運(yùn)行。

（三）文件配置

Webdemo內(nèi)容是使用可擴(kuò)展標(biāo)記語言（XML）定義的配置文件。它包含Webdemo的基元數(shù)據(jù)，如作者、標(biāo)題、創(chuàng)建日期和相關(guān)的講座或課件。清單列表1中給出了一個(gè)配置文件的摘錄，用于說明該文件的自我注釋體系。

清單列表1：XML定義的Webdemo基元數(shù)據(jù)配置文件

Guicai YU

guicai.yu@gmail.com

¨NCU_Internet_Lecture

4QAM

1.1

此外，可以定義任意數(shù)量的幻燈片，每個(gè)幻燈片可以是一個(gè)描述性或演示性的。描述性幻燈片可以包含文本、圖像和數(shù)學(xué)公式，其中可以用Latex編輯公式，使用MathJax撰寫。一個(gè)演示幻燈片包含各種輸入字段（控制操作命令）、觸發(fā)服務(wù)器端的仿真模擬按鈕、仿真模擬結(jié)果的圖像區(qū)域。

每個(gè)幻燈片必須包括一個(gè)腳本接口定義，實(shí)現(xiàn)仿真模擬和函數(shù)參數(shù)列表的Octave函數(shù)方程?；瑒?dòng)按鈕控件的值通過標(biāo)識(shí)確定。為防止多用戶會(huì)話之間的沖突，通過模板系統(tǒng)隨機(jī)選擇的文件名會(huì)被傳遞給函數(shù)方程。

三、Webdemo用戶操作界面及案例分析

圖2給出了一個(gè)Webdemo描述頁面截圖，展示了QAM調(diào)制理論的數(shù)學(xué)基礎(chǔ)。屏幕采用分辨率1024像素×768像素進(jìn)行優(yōu)化。此分辨率兼容大多數(shù)投影儀，因此可以在課件和講座中使用。Webdemo用戶界面幻燈片包括導(dǎo)航頁腳和內(nèi)容區(qū)域，導(dǎo)航頁尾包含上一頁和下一頁的鏈接，以及當(dāng)前頁即內(nèi)容頁的鏈接。在導(dǎo)航頁腳下面，可以添加關(guān)于Webdemo元信息和鏈接版權(quán)與隱私信息。同時(shí)，Webdemo用戶界面的一個(gè)特殊功能是可以通過腳注訪問使用的統(tǒng)計(jì)數(shù)據(jù)。

圖3中的屏幕截圖顯示了QAM調(diào)制解調(diào)前端可視化操作界面，可以通過界面右邊輸入并調(diào)整參數(shù)，如信噪比（SNR）、調(diào)制類型（QAM）及顯示的圖形類型，得到相應(yīng)的星座圖。星座圖的橫坐標(biāo)為實(shí)部，縱坐標(biāo)為虛部。圖3中的頁腳和頁眉功能與圖2類似，這里不做介紹。右下角的Source code可以下載仿真程序的源代碼（本文涉及的源代碼都為Matlab編寫），方便學(xué)生學(xué)習(xí)、編輯使用。鑒于文章篇幅限制，本文不附上Matlab的源代碼（WEBDEMO constellation_from_snr.m-file），仿真程序源代碼通過界面的Source code查看和下載。

操作界面中心為展示仿真圖像保留區(qū)域，在圖像區(qū)域的下方，是一個(gè)允許用戶輸入信息的控制面板。當(dāng)一個(gè)演示幻燈片界面被加載時(shí)，系統(tǒng)將使用默認(rèn)的參數(shù)值進(jìn)行仿真模擬。JS腳本顯示一個(gè)進(jìn)度條，提供關(guān)于已用和剩余的計(jì)算時(shí)間反饋信息。為了估計(jì)仿真計(jì)算的時(shí)間，模板系統(tǒng)計(jì)算每次執(zhí)行Octave函數(shù)所花時(shí)間和計(jì)算所有測(cè)量結(jié)果的平均值，然而實(shí)際仿真模擬時(shí)間通常與計(jì)算的平均值不同?，F(xiàn)有的Webdemos仿真時(shí)間從2秒到20秒不等，通常大于互聯(lián)網(wǎng)頁面響應(yīng)時(shí)間。動(dòng)畫的進(jìn)度條指示用戶正在進(jìn)行的計(jì)算過程，當(dāng)仿真結(jié)果圖像完成時(shí)，JS腳本從服務(wù)器請(qǐng)求圖像并在進(jìn)度條空間顯示，然后用戶可以通過“更新（Update）”按鈕控制改變仿真參數(shù)并重新仿真計(jì)算，“更新（Update）”按鈕提供載鏈接訪問底層Octave源代碼。圖4為將調(diào)制類型調(diào)整為16QAM而其他參數(shù)保持不變的仿真星座圖操作界面。圖5為將調(diào)制類型調(diào)整為64QAM而其他參數(shù)保持不變的仿真星座圖操作界面。

通過WEBDEMO用戶操作界面及案例分析發(fā)現(xiàn)，只要改變對(duì)應(yīng)的參數(shù)，就可以得出不同的結(jié)果。任何支持web瀏覽的設(shè)備都可進(jìn)入教學(xué)平臺(tái)并進(jìn)行感興趣的操作和結(jié)果演示。此平臺(tái)將提高學(xué)生學(xué)習(xí)的主觀能動(dòng)性，不再是“填鴨式”、記憶式的教學(xué)，而是理論與實(shí)踐相結(jié)合。

四、結(jié)論及意義

本文研究了基于Web的通信工程專業(yè)開源交互式可視化教學(xué)演示平臺(tái)，主要通過圖形和圖像可視化結(jié)合理論基礎(chǔ)的方式講授，采用啟發(fā)式的方法使得學(xué)生準(zhǔn)確掌握所學(xué)課程的知識(shí)點(diǎn)以及基礎(chǔ)理論知識(shí)在實(shí)際案例中的應(yīng)用。這在高等教育中顯得非常重要，特別是理工科技類專業(yè)。尤其是通信電子類專業(yè)本科生和研究生，需要具備扎實(shí)的數(shù)學(xué)和物理基礎(chǔ)知識(shí)，通過平臺(tái)與理論結(jié)合，解決學(xué)習(xí)基礎(chǔ)理論知識(shí)枯燥乏味、晦澀難懂的窘境。學(xué)生學(xué)習(xí)理論知識(shí)的同時(shí)，通過改變交互式、可視化教學(xué)演示平臺(tái)中的仿真參數(shù)而得到相應(yīng)的仿真結(jié)果變化，明確某些參數(shù)在工程實(shí)踐案例中的實(shí)際物理意義。這些結(jié)果不需要冗長(zhǎng)復(fù)雜的數(shù)學(xué)公式推導(dǎo)計(jì)算，學(xué)生通過交互式仿真結(jié)果就可以得到答案。

參考文獻(xiàn)

[1]Lu Hsin-Ke， Lin Peng-chun. Effects of Interactivity on Students Intention to Use Simulation-based Learning Tool in Computer Networking Education， 14th International Conference on Advanced Communication Technology， 2012， pp.573-576.

[2]A. M. Masson， Web-based Simulations for Computer-assisted Learning in the Higher Education Sector， Engineering Science and Education Journal， 1999， vol.8， no.3， pp.107-114.

[3]I. Belski， Acquiring a Holistic Picture： The 4 Screens Web-based Simulator Helping Students to Unify Behaviors of Electronic Systems， ICALT08， 8th IEEE International Conference on Advanced Learning Technologies， 2008， pp.154-158.

[4]Zhuang Hao， He Jin， Deng Wan-ling， et al. A Web-based Education Platform for Nanoscale Device Modeling and Circuit Simulation， 4th Interdisciplinary Engineering Design Education Conference， 2014， pp.84-87.

[5]G. Klimeck， M. McLennan， M. S. Lundstrom， and G. B. Adams III， “nanoHUB.org-online simulation and more materials for semiconductors and nanoelectronics in education and research，” in 8th IEEE Conference on Nanotechnology， Aug. 2008， pp. 401-404.

Research on Web-based Open-source Interactive and Visual Teaching Experiment Platform in Communication Engineering

YU Gui-cai

（Physical Science and Technology College， Yichun University， Yichun， Jiangxi 336000， China）

Abstract： The research on web-based open-source interactive and visual teaching experiment platform in communication engineering can provide technical support for expanding this single research result into the template and standardized user interfaces in the future. This platform is widely used in interactive and visual teaching experiment and case analysis for science and engineering students in colleges and universities. Through research and analysis， the teaching experiment platform can flexibly provide a large number of simulation parameter change operations and visual demonstration of corresponding result changes. This research result is an open-source platform， and the web front-end does not require the support of other software and user registration. Besides， any equipment that supports web browsing can enter the teaching experiment platform and perform operation and result demonstration of interest. The result can help to improve students subjective initiative in learning， which focuses on the combination of theory and practice.

Key words： communication engineering; Web; open source; visualization