基于openlayers的雷达回波显示

​ 随着软件的Web化越来越流行，我也开始尝试将Web技术应用到设备参数配置中。之前，我曾使用Vue设计Web页面，并将其发布到嵌入式的Linux系统上，结合web服务器运行，实现了类似路由器配置界面的功能。这种基于Web的方式方便直观，大大提高了设备配置的效率。未来一段时间，我将主要从事雷达相关工作，于是我开始思考，是否也可以通过Web技术来实现雷达回波的可视化？基于这一想法，我利用一些碎片时间着手开发该项目，最终完成了基于OpenLayers的雷达回波显示功能。

实现原理

项目采用B/S架构设计，其中前端采用Vue+openlayers，后端采用python编写。

上图描述了雷达视频数据从获取到最终在OpenLayers上显示的整个流程：

1. CAT240雷达视频数据：接收雷达的原始数据，默认采用2048个方位线，spoke长度 [1024, 2048, 4096, 8192]可选。
2. 数据解析/帧存储：对雷达数据进行解析，将解析的数据抽取到1024个点，存储一圈的数据至[2048,1024]的二维数组中。
3. 扇区图像映射：将一圈分成16份，每一份通过极坐标转换形成扇形图，雷达回波映射为PNG图片的alpha通道。
4. WebSocket发送：扇形图像转为blob对象通过WebSocket实时传输至web前端。
5. OpenLayers贴图显示：前端Js代码接收后将blob转为png图像，根据编号、量程获取贴图的坐标，最终在OpenLayers地图上进行可视化显示。

扇区图像映射

​ 最终，该功能是在ARM端实现的，由于资源有限，算法需要尽可能简单化。为此，我设计了一张映射表，用于将帧视频数据从极坐标转换到平面坐标。

具体实现上，我将完整的雷达图像划分为16个扇区，并为它们编号为0至15。假设雷达数据有2048根方位线，则每个扇区包含2048/16根方位线。通过三角函数进行极坐标转换，将每个视频数据点映射为极坐标形式的(r, a)，其中r为距离，a为角度。接下来，我判断该(r, a)坐标是否落在当前的扇区范围内。如果该坐标在扇区范围内，则将其记录在映射表(map_table)中；否则，在map_table中对应的位置填零。在后续处理过程中，扇区内的帧视频数据将通过映射表查找对应的平面坐标，然后将视频值赋给扇区形矩阵中的相应位置。这个矩阵将作为一张绿色PNG图片的alpha通道，用来展示雷达回波效果。通过这种方式，雷达回波可以以图像形式直观地显示在Web页面上。

上图为测试扇区图像映射功能生成的png

Openlayers的贴图显示

​ 在Web前端中，需要将16个扇形图像根据编号依次排列，并经过旋转和坐标变换后贴到地图上。在实现过程中，我遇到了两个主要问题：坐标系转换和图片的旋转。

1. 坐标系问题：
   OpenLayers使用的坐标系是EPSG:3857（墨卡托投影坐标系），该坐标系的优势在于坐标与像素之间的转换关系非常简单。通过这种简单的映射，可以对扇区图像进行旋转和缩放，然后将其精确地映射到地图上。
2. 图片旋转问题：
   OpenLayers默认情况下并不支持对图片进行旋转功能。在解决这一问题时，我在GitHub上找到了相关的解决方案，通过自定义的代码对扇区图像进行旋转，使得图片能够正确地与地图对齐。

How to rotate static image in openlayers 6.9 using turf and imageExtent · Issue #12977 · openlayers/openlayers · GitHub

遗留问题

​ 在不同量程下，雷达回波图像的接缝处出现了对不齐的现象。我怀疑问题出在坐标转换上，特别是在贴图时需要将极坐标转换为经纬度坐标。转换过程中使用的Vincenty算法可能存在一定的误差，或者是由于从三维空间到二维平面的转换本身存在偏差，这些都需要进一步修正。

​ 目前，为了解决这个问题，我采取的方法是在不同量程下对扇区的角度进行修正，从而调整图像的对齐情况。尽管这一方法能暂时缓解问题，但如果有专业人士能够提供更好的解答，欢迎留言或发邮件至：1174316744@qq.com。