这个图形是一个略复杂的图形，至少需要三个点才能绘制出来。这个图形分为以下三部分：
箭尾：由绘制的第一个点和第二个点构成。
箭头：由绘制最后一个点、箭尾的中点和其他一些参数计算出来的总共5个点构成。
箭身：由除了箭尾和最后一个点之外的其他点计算得出，其中一个绘制点对应计算出来的两个点，左右依次连接构成。
下图是一个四个点的简易图形（这只是第一步，后面会详细介绍如何圆滑处理拐角部分）。
计算图形所需要的固定值参数如下
第一步：确定箭尾的顺序。pnts是用于绘制进攻方向的全部点，是经纬度坐标转成平面坐标后的坐标。判断前三个点是否为顺时针方向，若是，则第一个点为trailRight，第二个点为trailLeft；否则，第一个点为trailLeft，第二个点为trailRight。
第二步：计算箭头的坐标点。通过trailLeft和trailRight计算箭尾的中点midTail，然后将pnts去掉箭尾的两点并在数组的开头插入midTail得到bonePnts，如下图所示
计算bonePnts点的连线的长度为len；
len与headHeightFactor的乘积就是headHeight；
pnts（绘制图形所需的点）的最后一个点就是headPnt；
之后的len被赋值为headPnt与其前一个点的距离；
tailWidth为箭尾的宽度；
如果headHeight大于tailWidth*headTailFactor，那么headHeight将被重新复制为tailWidth*headTailFactor;
之后通过headHeight乘以相关的倍数得到headWidth、neckWidth和neckHeight
headEndPnt就是headPnt沿着前一个点的方向，距离headHeight的点，同理neckEndPnt就是headPnt沿着前一个点的方向，距离headHeight的点；
headLeft和headRight是headEndPnt沿着headPnt的方向，旋转90°后距离headWidth的点；
neckLeft和neckRight是neckEndPnt沿着headPnt的方向，旋转90°后距离neckWidth的点；
最后将neckLeft、headLeft、headPnt、headRight和neckRight顺次放入数组中。
第三步：计算箭身的关键点
tailWidthFactor 为箭尾的宽度/bonePnts的长度
allLen是bonePnts的总长度的0.99次幂，len是bonePnts的总长度；
widthDif是（箭尾的宽度-箭头颈部的宽度）/ 2；
然后从下标为1的点开始循环至倒数第二个点，每次循环计算当前点和前一个点和后一个点组成的角度的一半angle，以及当前的位置相较于tailWidth和neckWidth的宽度w，然后根据当前点的位置、angle和w计算出一组left和right。
得到的箭身的点是左右两侧的点存放于一个数组当中，下图中的代码时将返回的箭身的关键点的左右两侧分开。
第四步：拐角点的圆滑处理
至此，已经绘制出如图一所示的右侧的简易进攻方向，但相较于左侧的最终效果，拐角处不够圆滑。所以，接下来就是将拐角点变成很多的点，从而形成圆滑的视觉效果。
计算出来的圆滑的点的实际效果如下图
第五步：将计算出来的所有点顺次连接组成多边形——进攻方向。
2021.10.13 好多人问我要源码，距离发文已经几年过去了~~源码来啦
