作为一个比较喜欢出去见识世界、看看自然风光的人,这几年有幸跑了一些地方,在祖国大地不同的地方见识了不同的人文风物,手机里也存了不少照片,想着如果以某种方式展现来回忆我的旅途的话,或许会给自己带来不一样的体验。目标口号已经想好:去过的风景,直观丰富地展示你的人生旅途,带来新的回忆感受。在看到leaflet开源地图库时,觉得可以比较简单地初步实现我的想法。
![640?wx_fmt=png&tp=webp&wxfrom=5&wx_lazy=](http://mmbiz.qpic.cn/mmbiz_png/5mt0ewv9OS1sv3IRkqffrpIbq5KmxIlevxPC0uSiaodmGB20sKiaAiajPyicFIxdXUav48GbN3OU2tlVefrS3ZQ4Gg/640?wx_fmt=png&tp=webp&wxfrom=5&wx_lazy=1&x-oss-process=image/resize,w_1400/format,webp)
初步效果
效果图1 - 60多张照片的效果图
![640?wx_fmt=png&tp=webp&wxfrom=5&wx_lazy=](http://mmbiz.qpic.cn/mmbiz_png/5mt0ewv9OS1sv3IRkqffrpIbq5KmxIleRibShqsmDbh82KBI4cardtqbsPyqXkU6o8ibxRCPukIXybxoUHibeyicKw/640?wx_fmt=png&tp=webp&wxfrom=5&wx_lazy=1&x-oss-process=image/resize,w_1400/format,webp)
效果图2 - 点击显示当时的照片
效果图3 - 可以进一步加入文字描述内容与动态效果
思路
一般手机照片都包含丰富的信息,如拍摄时间等等,而python又有强大的PIL图像处理库,使得我们可以轻松解析照片信息。在服务端我们可以使用Django来负责产生简单的上传机制,将上传的图片放入静态资源文件夹以提供路由,并且对照片进行解析,获得的信息利用Django自带的ORM编写照片信息模型,存入默认的sqlite3数据库,十分简便,然后利用Django-restframework库将照片信息生成api,方便前端异步获取。在前端利用leaflet地图库生成展示效果,为了以后的开发,采用了vuejs框架,利用vue-resource从api异步get数据,并同步到页面。
这样我们使用时便可以方便地一步上传照片,在地图上再现我们去过的风景,点击出现当时的情景。当然直接根据照片只获得了基本的时间和经纬度信息,进一步我们可以提供提交修改功能,让用户自己较为精细地修正地理位置(某些地理位置并不十分准确),并对照片做注解,提交回忆文本,然后一并展示。更进一步是利用时间数据,动态地显示我们的旅途轨迹,以及自动生成整个人生旅途的动态展示效果。
leaflet文档很详细丰富,api文档也很美观,插件也不少。使用leaflet使用两三句js语句就可以轻松地产生应用效果。不要对文档望而生畏,我一开始也嫌烦,懒得看,后来静下心一看发现很容易上手。在github上还有中文地图图层提供商的列表(不需要api key),我使用了高德地图,个人比较喜欢。可用插件有Leaflet.EasyButton、Leaflet.markercluster。
原文发布时间为: 2017-03-12
本文作者:treelake
本文来自云栖社区合作伙伴“Python中文社区”,了解相关信息可以关注“Python中文社区”微信公众号