红心向阳 百鸟朝凤

背景

最近在玩 folium 模块，基于使用过程中的一些个人体验，对 folium 进行了二次封装，开源在 GpsAndMap.在使用的过程中，发现在地图上打图标是可以进行旋转的。遇到就发现了一些有意思的玩法。

隔海的相望

下面的代码在地图 厦门市 和 台北市 位置添加了箭头的图标。

# -*- coding:UTF-8 -*-

# region 引入必要依赖
from GpsAndMap.MapModule import *

# endregion


地图 = 地图类().添加瓦片.高德地图().地图

图层 = 地图.添加图层('我有红心向太阳')

地图.添加标记(图层, 图标标记类(位置=常用坐标.厦门市, 图标='glyphicon-arrow-right'))
地图.添加标记(图层, 图标标记类(位置=常用坐标.台北市, 图标='glyphicon-arrow-right'))

地图.保存html(目标路径='.').打开()

上图中，我们可以看到在厦门和台北的两个图标，其箭头都是朝东的，如何让他们相望呢？
下面的代码在图标样式中加了旋转参数，将台北的图标旋转180度，看下效果。

# -*- coding:UTF-8 -*-

# region 引入必要依赖
from GpsAndMap.MapModule import *

# endregion


地图 = 地图类().添加瓦片.高德地图().地图

图层 = 地图.添加图层('我有红心向太阳')

地图.添加标记(图层, 图标标记类(位置=常用坐标.厦门市, 图标='glyphicon-arrow-right'))
地图.添加标记(图层, 图标标记类(位置=常用坐标.台北市, 图标=图标样式类(名称='glyphicon-arrow-right', 角度_度=180)))

地图.保存html(目标路径='.').打开()

上图中，台北市的图标的箭头，指向了大陆，但是没有指向厦门方向。
下面的代码，我们在厦门和台北之间连一条线，做为参考线。

# -*- coding:UTF-8 -*-

# region 引入必要依赖
from GpsAndMap.MapModule import *

# endregion


地图 = 地图类().添加瓦片.高德地图().地图

图层 = 地图.添加图层('我有红心向太阳')

地图.添加标记(图层, 图标标记类(位置=常用坐标.厦门市, 图标='glyphicon-arrow-right'))
地图.添加标记(图层, 图标标记类(位置=常用坐标.台北市, 图标=图标样式类(名称='glyphicon-arrow-right', 角度_度=180)))

地图.添加标记(图层, 折线类(点序列=[常用坐标.厦门市, 常用坐标.台北市]))

地图.保存html(目标路径='.').打开()

上图中，我们看到厦门的图标指向台弯，台弯的图标指向大陆，但都没有指向彼此的方向。

角度的计算

我们又知道，图标的方向可以通过参数角度_度来进行控制，那么如何知道厦门在台北的哪个方位呢？反过来，如何知道厦门在台北的哪个方位呢？
GpsAndMap模块的 GpsModule 模块内的 GPS坐标类，为我们提供了计算两个GPS坐标点之间相对方位角的方法。
下面的代码中，我们基于厦门市的坐标计算了台北位置的方位

# -*- coding:UTF-8 -*-

# region 引入必要依赖
from GpsAndMap.MapModule import *

# endregion

# 计算以厦门位置为原点，纬度正东为正，逆时针方向为正的坐标下，北台所在的方位角
print(常用坐标.厦门市.倾角(常用坐标.台北市).墨卡托倾角deg)

面的代码告诉我们，台北在厦门的东方偏北10.236476087381755度角的位置。
下面的代码，基于上述角度计算的方法，使厦门和台北进入相望状态。

# -*- coding:UTF-8 -*-

# region 引入必要依赖
from GpsAndMap.MapModule import *

# endregion

地图 = 地图类().添加瓦片.高德地图().地图

图层 = 地图.添加图层('我有红心向太阳')

地图.添加标记(图层, 图标标记类(位置=常用坐标.厦门市, 图标=图标样式类(名称='glyphicon-arrow-right', 角度_度=-常用坐标.厦门市.倾角(常用坐标.台北市).墨卡托倾角deg)))
地图.添加标记(图层, 图标标记类(位置=常用坐标.台北市, 图标=图标样式类(名称='glyphicon-arrow-right', 角度_度=-常用坐标.台北市.倾角(常用坐标.厦门市).墨卡托倾角deg)))

地图.添加标记(图层, 折线类(点序列=[常用坐标.厦门市, 常用坐标.台北市]))

地图.保存html(目标路径='.').打开()

上图中，我们看到厦门和台北的图标箭头彼此指向对方，相互守望。

红心向阳

有了以上关于图标角度的控制方案，时值国庆在即，我们将之前 GpsModule 模块中收集的常用地市的坐标标记在地图中，使用红心做为图标，控制红心的旋转角度，就可以轻松实现将所有的红心的方向都指向北京市的效果，红心向阳，百鸟朝凤。

# -*- coding:UTF-8 -*-

# region 引入必要依赖
from GpsAndMap.MapModule import *

# endregion

地图 = 地图类().添加瓦片.高德地图().地图

图层 = 地图.添加图层('我有红心向太阳')

北京坐标 = 常用坐标.北京市

地图.添加基地(图标标记类(位置=北京坐标, 图标=图标样式类(名称='glyphicon-star', 颜色=颜色名.红)))

图标层 = 地图.添加图层('万众归心', 默认显示=True)

for 城市, 坐标 in 常用坐标.常用坐标字典.items():
    if 坐标.有效 and 城市 != '北京市' and 城市[-1] in ['市', '州']:
        图标 = 图标标记类(位置=坐标, 图标=图标样式类(名称='glyphicon-heart-empty', 颜色=颜色名.浅红, 角度_度=-坐标.倾角(北京坐标).墨卡托倾角deg+90), 消息=城市)
        地图.添加标记(图标层, 标记点=图标)

地图.保存html(文档名='我有红心向太阳', 目标路径='.').打开()

以上代码生成的html文档见：红心向阳 百鸟朝凤, 提取码：nn5k

上图中，我们可以看到，每一个红心的心口，均朝向北京市方向。

小结

以上便是今天分享的 红心向阳，百鸟朝凤 效果了。