导航中放大路口是指电子设备导航中,在路口对当前路口放大显示的功能。在移动设备导航中对导航起到非常重要的作用,可以给用户更加清晰准确的方向指引。

本文提供一种放大路口图像渲染方法和思路,通过对路线墨卡托轨迹点数据进行转换映射到屏幕上进行渲染,以较低的代价实现放大路口功能效果。

效果图:

算法流程:


算法概述:


墨卡托转换屏幕像素:

解决问题:使墨卡托坐标系映射为屏幕坐标系。 公式:pixelPoint = (mercatorPoint - junctionPoint) x 100000 + basePixelXY 计算每个点与junction point的差值,乘以一个倍数获得相对坐标,再根据相对坐标加上junction point指定的屏幕坐标

轨迹旋转:

解决问题:使路口旋转到用户的第一视角。 步骤1:取ingoing首尾两个点连成的直线ab,计算出与屏幕y轴形成的角度α 步骤2:计算每个点以junction point为原点旋转角度α后的点坐标。

矢量缩放:

解决问题:根据画布尺寸和屏幕分辨率动态拉伸图像而不产生模糊。

步骤1:查找出每个分支的顶点 步骤2:查找所有顶点中最短,即最靠近junction point的点A 步骤3:根据公式 mul = (baseX - n) / baseX(如果是Y轴方向则取baseY),分别计算A点x y方向拉伸到屏幕边缘的倍数 步骤4:取x、y方向倍数中较大的值作为实际拉伸倍数m 步骤5:遍历所有点乘以倍数m,得出缩放后的位置,再进行画线

可视区域数据裁剪:

解决问题:由于等比例拉伸后,部分数据将超出屏幕很远,导致渲染性能下降严重,通过该算法进行裁剪后仅保留可视范围内的数据,最大限度压缩渲染内容。 步骤1:计算超出屏幕的点与前一个点的连线与屏幕边缘的交点A 步骤2:取交点A替代超出的点,并舍弃该点后面点所有点

轨迹修正:

解决问题:由于原始轨迹点分布不均,无法实现绘制均匀的路面箭头的需求,因此需要对轨迹做修正。

原理:遍历原始轨迹,在每两个点之间连成的直线上没隔一个指定距离插一个点。

求曲线平行线:

解决问题:双向车道需要在路面绘制两排对称的箭头标识,依据现有的轨迹数据无法实现,需要计算求出平行的轨迹。

原理:由于轨迹是曲线的,要求出曲线的平行线。本方案采用对曲线进行细分,把曲线分成若干由两个点组成的直线,并计算每一段直线以相同斜率和角度移动后的平行线,最后再连接起来得出平行的曲线轨迹。