基于WebGL的换热器三维Web应用设计与开发

2020-09-02宋小鹏古小敏石姣玲

软件导刊 2020年8期

宋小鹏古小敏石姣玲

摘要：为提高设计速度，避免手工计算中的错误，提高可重用性，实现设计效果的3D实时预览，以空调与制冷领域的换热器设计为例，介绍WebGL在工业工程设计中的应用，具体过程包括前处理、计算及后处理。在后处理中基于WebGL实现对制冷设计效果的三维预览，最终通过Web应用实现制冷换热器设计与简单图纸输出。实践结果表明，该应用可有效减少换热器设计与试算过程中的手工计算工作量，程序可直接生成二维或三维图纸，以避免因手工计算失误或工况改变而需要反复大幅度手动修改图纸的情况。

关键词：制冷设计;Web应用;WebGL;换热器

DOI：10. 11907/rjdk. 201670 开放科学（资源服务）标识码（OSID）：

中图分类号：TP319文献标识码：A 文章编号：1672-7800（2020）008-0147-04

Abstract：Web application in industrial engineering design process has been discussed with the aim to improve the calculation speed involved， avoid errors in manual calculation， improve reusability， and realize 3D real-time preview of design. Taking the design of heat exchanger for air conditioning and refrigeration as an example， this paper introduces the Web application and WebGL in industrial engineering design， including pre-processing， calculating and post-processing. In the post-processing， the 3D preview of refrigeration design has been realized based on WebGL. The drawing sheet for the heat exchanger have been completed through Web application. The practice shows that the Web application can effectively reduce the manual calculation workload in the design process of heat exchanger， also reduce the manual calculation workload in the trial calculation. And two-dimensional or three-dimensional drawing sheets could be directly generated via the Web application， so as to avoid the calculation error via manual calculation， and to avoid the modification of drawing sheets manually when working conditions are changed.

Key Words： refrigeration design;Web application;WebGL;heat exchanger

0 引言

得益于計算机性能的进步，以及现代浏览器对WebGL和WebAssembly的支持，Web应用能够承载的内容越来越丰富，实现的功能越来越多，计算能力也越来越强。已有Web应用可用于电路仿真工具（如英飞凌的电路在线仿真工具[1]）、印刷电路板（PCB）布线软件（如立创的PCB设计工具[2]）、三维模型设计软件（基于three.js的三维编辑器[3]）、三维几何体内流计算前后处理界面[4]、基于开源求解器（OpenFOAM 和CalculiX等）的Web工具和服务[5] ，甚至完全在线版的PhotoShop[6]等。这些在线程序的出现表明Web应用在替代原有传统计算机程序方面具有很大潜力，同时因其具备良好的跨平台性能，以及免编译、轻量级、富有交互性等优点，可应用于工业设计过程的大量场景中。例如甘杜芬等[7]使用Web应用开发船舶通信数据可视化系统，其数据过滤性能优于传统方法。

现代浏览器可支持WebGL技术，使得在网页中显示三维信息成为可能。学者们针对基于WebGL的轨道交通与地形地貌可视化进行了大量研究。如童丽闺等[8]利用基于HTML5的Web应用与虚拟现实技术开发管廊三维地理信息系统，能够提供有价值的辅助决策信息;任宏康[9]基于第三方WebGL库three.js实现了三维地形的可视化显示，并通过实验对该方法进行验证;陈坤等[10]基于Web应用开发了公路基础数据地理信息系统;杨喆等[11]结合BIM与GIS技术开发了基于WebGL的轨道交通可视化Web应用;边金龙等[12]基于WebGL技术开发了交通监控应用程序;郭神福等[13]基于WebGL技术开发了列车运行及沿线虚拟地理环境仿真系统。

WebGL技术门槛较高，需要完备的计算机三维图形图像学知识，而three.js引擎较好地封装了WebGL，使得非专业技术人员也能快速开发基于WebGL的应用程序。如冯姣等[15]使用Three.js引擎开发了飞机仿真系统;刘冬林等[16]基于Three.js的在线编辑器开发了机器人模型运动学仿真系统;陈林等[17]基于Three.js引擎开发了管线三维建模可视化系统;侯严庭等[18]基于Three.js引擎开发了机械产品自动装配演示Web应用。

2.4 应用效果

图4为使用Web应用生成图纸在开源CAD软件中的显示效果，当设计存在问题时，修改程序重新生成图纸，直到满足设计要求。该操作能在最大程度上规避因设计参数改变而需要重新绘图的问题，节省了设计时间。

3 结语

本文介绍了具有轻量级、高交互性、设备无关以及免编译等特点的Web应用，并将其应用于制冷设备的换热器设计中，实践结果表明：

（1）由于HTML5的跨平台优势，Web应用能够支持各大主流操作系统和硬件平台。

（2）通过JavaScript编程可减少手工计算工作量，且计算速度远高于手工计算，同时能最大程度上减少手工计算的失误。

（3）通过相关库函数及WebGL可生成简单的2D/3D图纸，从而大幅减少因前期设计失误导致需要反复手动绘制图纸的工作量。

参考文献：

[1] Infineon. 英飞凌电路在线仿真工具[EB/OL]. https：//www.infineon.com/cms/cn/tools/landing/ifxdesigner.html.

[2] 立创EDA.PCB设计工具[EB/OL]. https：//lceda.cn/.

[3] three.js官网. 基于three.js的3D建模工具[EB/OL]. https：//threejs.org/editor/.

[4] SimCapsule. 云仿真平台[EB/OL]. https：//www.simcapsule.cn/.

[5] 北京蓝威技术有限公司. 基于开源求解器的Web工具和服务[EB/OL]. http：//www.easycae.cn/.

[6] Photopea.Web版PhotoShop [EB/OL]. https：//www.photopea.com/.

[7] 甘杜芬，陈小海，付功伟. WEB前端开发技术在船舶通信数据可视化中的应用[J]. 舰船科学技术，2020，42（10）：127-129.

[8] 童丽闺，刘艳军. 基于HTML5和虚拟现实的综合管廊三维地理信息系统[J]. 科技资讯，2017，15（22）：9，11.

[9] 任宏康，祝若鑫，李风光，等. 基于Three.js的真实三维地形可视化设计与实现[J]. 测绘与空间地理信息，2015，38（10）：51-54.

[10] 陈坤，逯跃锋，王少渤，等. 基于WebGIS的四川省营山县农村公路基础数据管理系统设计与实现[J]. 科技风，2020（15）：19-20.

[11] 杨喆，付功云，袁文祥，等. 基于WebGL三维引擎的轨道交通工程BIM+GIS平台研究[J/OL]. 土木建筑工程信息技术：1-11[2020- 06-14].http：//kns.cnki.net/kcms/detail/11.5823.TU.20200529.0859. 002.html.

[12] 边金龙，周伟健，曹晓强. 交通监控管理系统中互联网WebGL三维可视化技术的应用[J]. 中国交通信息化，2020（3）：130-133.

[13] 郭神福，赵孔阳，王孝龙，等. 基于WebGL的高速列车在线运行及沿线虚拟地理环境仿真[J]. 铁道科学与工程学报，2020，17（3）：573-581.

[14] 谭傜月，张余强，何小海，等. 基于WebGL的勘探地形及探井信息三维可视化系统设计[J]. 现代计算机，2020（3）：99-103.

[15] 冯姣，刘志勤，黄俊，等. 基于Three.js的飞行仿真系统设计[J]. 计算机测量与控制，2020，28（2）：216-219.

[16] 刘冬林，樊留群，刘广杰，等. 基于Three.js的COLLADA机器人模型在线运动学仿真[J]. 制造业自动化，2020，42（2）：82-85.

[17] 陈林. 基于Three.js的地下管线三维建模可视化研究[J]. 测绘与空间地理信息，2018，41（8）：93-96.

[18] 侯严庭. 基于Three.js的机械产品自动装配演示[J]. 软件工程，2018，21（3）：23-26.

[19] 陈忠. 地源热泵地埋管换热器换热性能研究[J]. 真空科学与技术学报，2020，40（5）：495-498.

[20] 谢洪涛，李星辰，绳春晨，等. 微通道换热器结构及优化设计研究进展[J/OL]. 真空与低温：1-10. [2020-06-14]. http：//kns.cnki.net/kcms/detail/62.1125.O4.20200502.1057.002.html.

[21] 尹珩宇，杜梅芳，曹先常，等. 焦爐荒煤气显热回收换热器传热特性的实验研究[J]. 能源工程，2020（2）：80-84.

[22] 刘秀峰，张诗，周志杰，等. 换热器结构优化与换热性能评价指标研究[J]. 化工学报，2020，71（S1）：98-105.

[23] 文键，王春龙，刘华清，等. 板翅式换热器波纹翅片性能数值模拟及其优化[J]. 高校化学工程学报，2020，34（2）：335-341.