背景
最近在玩 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
上图中,我们可以看到,每一个红心的心口,均朝向北京市方向。
小结
以上便是今天分享的 红心向阳,百鸟朝凤 效果了。