基于B/S 架构的耙吸船施工三维监视系统设计与研究

许墅，戴文伯，周雨淼，季明

（中交疏浚技术装备国家工程研究中心有限公司，上海 200082）

0 引言

国外于20 世纪80 年代提出数字化的疏浚监视系统，提高了疏浚船舶的施工效率[1]。国外以IHC 公司为代表，其疏浚施工监控系统可大大提高船舶航行与作业的安全性、可靠性和经济性，国内的中交疏浚研究中心等单位都自主研发了疏浚施工监视系统，包含船舶定位、剖面显示、施工状态监控以及历史回放等功能，在国内众多挖泥船上得到广泛应用[2-5]。

目前的疏浚施工监视系统大多是二维系统，缺少三维施工监视功能，导致系统监视效果不够直观形象，而且系统都是基于C/S（Client/Server）架构，导致每台客户机都需安装客户端软件，并进行调试，当有多台客户机时，安装部署和维护较为麻烦，当有跨平台需求时，对不同操作系统需要单独开发客户端软件[6]。而基于B/S 架构的系统在处理多终端需求时，只需要在服务器上部署系统，更新较为方便，客户端只需普通网页浏览器即可访问系统[7]。随着网络通信技术的发展，浏览器业务处理能力逐渐增强，基于B/S 架构的监控和管理系统已在多个领域得到应用[7-8]，而随着WebGL 的逐渐成熟，也让三维Web 开发成为未来的发展趋势[8]。

针对目前耙吸船施工监视系统存在的问题，本文设计了一套基于B/S 的耙吸船施工三维监视系统，利用WebGL 技术将水下地形和耙吸挖泥船模型在网页中三维显示，并根据实时获取的传感器数据驱动船体和耙臂模型运动，同时支持通过实时计算耙头与水下地形接触时的耙头位置，对地形进行重构并显示。该系统为疏浚作业提供可交互的三维视角，为高精度施工提供新的工具，让疏浚人员直观了解施工区域水深情况和疏浚轨迹。

1 系统概况

1.1 系统架构

系统采用B/S 架构，分为数据库、服务器和浏览器3 个部分（如图1 所示）。

数据库存放着耙吸船的船体和耙臂3D 模型、实时数据、水深数据以及由水深数据在服务器端生成的地形数据。服务器负责响应前端浏览器的请求并做处理，返回3D 模型数据、地形数据和施工数据，其中地形数据在服务端生成，利用地形构建算法，由水深数据构建生成，并保存到数据库中，此外，前端浏览器会将地形重构的结果发到服务器端，由服务器负责将地形重构结果进行保存。前端浏览器根据从服务器获取的船舶3D模型实现船舶3D 显示，并添加水面模拟效果；根据从服务器获取到的施工数据驱动船体模型运动，实时显示船体方位、耙臂角度、耙头姿态、吊架姿态等信息；根据从服务器获取的地形数据构建水下地形并渲染显示，同时根据耙头位置实时重构地形，模拟挖掘效果，同时向服务器返回地形重构结果。

1.2 系统功能

本系统主要包含场景交互、施工可视化和场景模拟三大功能。场景交互实现用户对虚拟场景的交互操作，包含视角控制、视点切换和船体透明等子功能，其中视角控制可实现移动观察、静止观察和围绕船体3 种漫游模式的自由切换，以适应不同场景下漫游查看的需要。移动观察模式下用户可自由调整视角，且视角跟随船体移动，从而便于观察船舶姿态变化，防止船舶移出画面；静止观察模式下用户可自由调整视角，但视角不跟随船体移动，从而便于观察船舶运动状态和周围地形；围绕船体模式下，视角以船为中心绕船移动，且跟随船体移动，从而方便观察船体四周情况。视点切换功能以画中画形式将小窗口视景快速定位到指定的视角位置，如耙头、泥舱等位置，从而方便用户观察特定区域的状态。施工可视化实现耙吸船疏浚过程的可视化监控，基于实船数据驱动场景仿真模拟，包含航行模拟、吃水模拟、耙臂姿态模拟、地形挖掘等功能。场景模拟实现耙吸船施工场景的再现，包含船舶3D 显示、水面模拟、地形可视化和光照模拟等。整个系统功能如图2 所示。

图2 系统功能图Fig.2 System function diagram

2 主要技术问题及解决方案

2.1 数字地形模型构建

通过多波束等声呐设备采集到的现场施工区域水深数据是离散点形式，数据点间距一般各不相同，适合以不规则三角网（TIN）构成面片，因此，本文采用Delaunay 方法构建地形三角网。先将三维空间的水深离散点集投影到XY平面，对3D 离散点集进行降维操作，变为2D 平面离散点集，将3D Delaunay 三角化变为2D Delaunay 三角化，降低了三角化的复杂性。然而Delaunay 方法具有凸包特性，针对凹包形态离散点会生成多余三角网[9]，图3—图5 说明凹包形态离散点采用Delaunay 方法构网存在的问题，图3 是凹包形态的原始离散点，图4 是期望的正确三角构网结果，图5 是采用Delaunay 方法三角构网的错误结果，其中虚线部分三角形是生成的多余三角网，从而使得三角网边界形态与原始离散点边界形态不一致，导致地形构建的区域超过原始离散点覆盖的区域，影响地形构建的准确性和后期渲染的美观性。施工现场采集到的水深离散点边界不规则，形态各异，因此采用Delaunay 方法必须首先要解决生成错误网格的问题。

图3 离散点Fig.3 Discrete point

图4 正确构网结果Fig.4 Correct triangulation results

图5 错误构网结果Fig.5 Error triangulation results

针对错误网格问题，本文通过在Delaunay 三角化中引入三角网索引和拓扑属性，在生成的三角网基础上借助三角形链表和邻边关系，通过遍历三角网最外侧三角形，即邻边三角形个数小于3 的三角形，从而剔除边长超过阈值的三角形，同时更新三角形链表和邻边关系，然后重新循环此过程，直至最外侧三角形边长都小于阈值才结束，进而优化三角网形态。图6 是数字地形模型的完整构建过程。

图6 数字地形模型构建过程Fig.6 Construction process of digital terrain model

本文边长阈值根据计算的离散水深点平均间距而确定，即将平均间距乘以1 个放大系数后作为阈值，经过测试，系数取1.5~2.0 比较合适。图7 是未优化的错误三角网效果，图中方框区域可明显看出存在的错误网格，图8 是优化后的正确三角网效果。

图7 错误三角网效果Fig.7 Error triangulation effect

图8 正确三角网效果Fig.8 Correct triangulation effect

2.2 地形重构

耙吸挖泥船在疏浚施工过程中耙头与地形相互作用，使得地形实时发生变化，耙头作用区域地形会发生塌陷，形成挖槽，因此，耙吸船施工三维监视需要研究实时的地形重构技术，实现耙头挖掘地形的模拟。针对地形的动态修改，本质上是对地形几何顶点空间位置的修改，因此首先需要获得耙头挖掘影响区域的顶点，如图9 所示，然后对这些顶点位置进行修改。由于需要实时展现耙头挖掘地形的效果，但地形空间范围广，顶点数量多，因此需要一个高效的算法快速查找到耙头挖掘过程中经过区域的地形顶点。

图9 耙头影响区域内的顶点Fig.9 Vertices within the influence area of the rake head

本文采用BVH（Bounding Volume Hierarchies，层次包围盒）方法实现高效快速获得耙头影响区域的顶点。BVH 方法的核心思想是用体积略大而几何特征简单的包围盒来近似地描述复杂的几何对象，所有包围盒分层逐次地再次包围，获得一个更大的包围盒，直到包围住所有物体，实际上，它是一个树形结构，因此可以仿照树的结构，将2 个或3 个小的包围体包围成1 个更大的包围体，以此类推。图10 是BVH 方法构建层次包围盒的示意图。

图10 层次包围盒示意图Fig.10 BVH schematic

本文在地形构建过程中采用BVH 方法同步构建地形层次包围盒，将地形划分为若干包围盒包围的细小区域，从而对耙头与相交的区块做进一步的相交测试，大大加速耙头与地形相交测试的过程，更快获得相交区域的地形顶点。图11 是建立的地形层次包围盒效果图。

图11 地形层次包围盒Fig.11 Terrain BVH

2.3 数据压缩

B/S 架构下，前端WebGL 程序需要向服务端请求大量三维场景数据，而在浏览器中显示高精度三维场景易受到网络带宽的限制，为将加载时间控制在可接受的范围内，从而缩短响应时间，提升用户体验感，本文使用Draco 压缩算法对服务端存放的耙吸船模型和地形等数据进行压缩，后传输给前端解压并使用，经过测试，耙吸船模型数据压缩率达到50%左右，地形数据平均压缩率为70%左右。

3 实现效果

系统后端针对上传的水深文件进行地形构建处理，生成地形模型，前端三维窗口初始化时加载船体模型和地形模型，并根据从后台获取耙吸船的船位、航向、潮位、耙臂姿态角度等数据在三维场景初始化船体状态，最终利用WebGL 技术渲染显示船体、水面和地形，其中地形根据设定的水深颜色表进行分级显示，同时在地形上叠加上光照和阴影，使得地形渲染效果更有立体感。三维场景初始化完成后，前端从后台定时获取施工数据，从而在三维场景中动态更新船舶施工运行状态，包括船舶航行轨迹、耙臂和耙头姿态等，同时利用地形重构技术，结合耙头位置信息，实现耙吸船疏浚过程水下泥面的实时动态更新。

图12 是前端系统界面图，在页面上方的菜单栏中可以显示挖泥船和周围环境的一些基本状态信息，如航速、船体吃水、航向、GPS 位置、潮位等，并有能控制船体透明开启或关闭的切换按钮，以及视角控制模式切换的按钮，视图窗口右侧是2 个小窗口画面，方便用户观察特定区域的场景画面。

图12 前端系统界面图Fig.12 System interface diagram

图13 是利用系统实现的耙吸船疏浚过程三维监视效果，用户可直观了解施工区域水深情况和疏浚轨迹，实时查看水下地形动态重构效果，并能直观查看耙臂实时姿态。

图13 耙吸船疏浚过程三维监视效果Fig.13 3D monitoring effect of TSHD during dredging process

经测试，系统在处理器I7、显卡NVIDIA GTX1080、内存16G 的电脑上运行，渲染帧速达到30FPS 以上，可流畅操作，而且利用相同的施工数据同步驱动二维施工监视系统和三维监视系统，测试结果表明，三维监视系统的船舶位置、耙臂姿态和施工轨迹等与二维监视系统保持一致，满足施工控制要求。图14 是二维施工监视系统和三维施工监视系统同步对比的效果。

图14 二维和三维施工监视系统同步对比Fig.14 Synchronous comparison of 2D and 3D construction monitoring systems

4 结语

针对基于C/S 架构的二维施工监视系统存在的不足，本文设计并开发了一套基于B/S 架构的耙吸船三维施工监视系统，解决了数字地形模型构建、地形重构和数据压缩等关键技术难题。系统采用WebGL 技术建立了三维可视化系统，并接入施工数据，从而对当前船体运行状态、耙臂姿态等进行三维动态展示，并实现耙吸船疏浚过程水下泥面实时三维动态更新。系统开发成果为耙吸船疏浚作业提供全新和可交互的三维视角，将助力疏浚作业高质量施工。