2023SuperMap杯第二十一届全国高校GIS大赛

安徽农业大学-成都市冷链生鲜配送服务系统

安徽农业大学-成都市冷链生鲜配送服务系统

安徽农业大学-成都市冷链生鲜配送服务系统

参赛院校:安徽农业大学

指导老师:李军利

队员姓名:彭兴涛

 

作品架构

系统技术栈

在前端方面,使用了当下流行的supermap JavaScript iclient完成webgis有关的功能。在项目搭建方面,使用vue脚手架,以及开源项目vue-admin构建整个项目,使用vue2语法编写整个项目逻辑,使用vue-router管理路由,使用了vuex储存公共状态,这里主要储存了,不同视图间的地图要素对象并在组件中传递通用参数。还封装了多个通用的axios请求,便于项目维护,此外整个项目使用webpack构建,在本地开发通过配置webpack端口代理实现跨域操作。

在后端方面,使用了轻量级,高度灵活、高性能的flask框架搭建整个后端。使用sqlalchmy作为ORM工具包操作postgresql数据库。整个项目的gis服务功能主要由当前技术领先的gis平台supermap iserver提供。

在数据库层面上,主要由postgresql数据库和mongodb数据库,其中postgresql数据库添加了 postgis拓展,便于通过操作数据库中的空间信息,来管理中的店铺的矢量要素。

在数据组织上,使用了关系型数据库和文档型数据库相结合的形式,使用postgresql+postgis拓展来管理空间数据和其他关系表,使用文档型数据库管理非结构型数据,各取所长便于数据管理。

 

系统功能

地图基本操作

在地图主页,将自动展示天地图矢量图层、天地图矢量标记图层以及动态加载的店铺要素。可以通过上下滚轮实现地图的放大缩小,也可以按住鼠标左键拖动地图。此外,还可通过左边控件栏的放大缩小按钮对地图进行相同的操作。

叠加的政区地图将会按照分级进行显示,并且限制了最高和最低的缩放倍数,在一定的缩放倍数下,路网信息会被隐藏。

多边形框选查询

侧边栏的多边形框选工具和矩形框选工具可以对地图要素进行框选查询。查询到结果后会从底部弹出所框选的信息的表格,此外还可多次框选追加到结果列表中。使用侧边栏的“清空图层”按钮可以清空当前绘制的所有几何要素并清空表格。

地图导航

点击“导航到最近店铺”后,点击主城区内任意一点,可以自动查询事件点3km内最近的店铺,并以该店铺为起点导航至事件点。寻找到目标点后,会将路线加载到地图上,并在节点处依次弹出导航信息。导航路线的最后一站会直接与目标点相连,以提高观感。导航结束后,同样可以点击清空全部绘制图层按钮,清空路线与标记。

最近设施查询

点击“导航到最近店铺”后,点击主城区内任意一点,可以自动查询事件点3km内最近的店铺,并以该店铺为起点导航至事件点。寻找到目标点后,会将路线加载到地图上,并在弹窗显示导航信息。导航路线的最后一站会直接与目标点相连,以提高观感。

计算服务区

使用框选查询查询一定数量的店铺要素,在下方弹出的表格最左侧多选框,选择若干店铺,也可点击表格最上方的全选按钮全选当前框选区域内的所有要素。选择一定数量店铺要素后,点击左侧控件栏中的“计算缓冲区”按钮,将会生成以店铺为中心3km范围的缓冲区。使用“清空图层”控件可以清除当前绘制的缓冲区。

商店列表

点击左侧控件栏中“展示商店列表”,可开关显示店铺表格,使用框选工具查询一定范围的店铺后,可以点击表格中的某一行来打开该店铺的弹窗。并且使用多选框选中店铺后,店铺会高亮在地图上。

店铺搜索

主页面右上角的搜索框可以按输入关键词对店铺进行检索,若检索到结果,会弹出搜索列表中第一个要素的弹窗,其他匹配要素则会高亮在地图中显示。

地图要素交互

主页面地图各要素还支持交互,点击任意一个店铺要素,都可在弹窗中显示基本信息,其中地址是根据经纬度进行地理逆编码得到并存储进数据库。

点击库存概览,会弹出对应店铺的库存价目信息。点击价目信息上的编辑库存,会调转到店铺详情-库存信息页面。点击地图可关闭当前的库存弹窗。

计算热力图

点击左侧控件栏的“计算热力图”可以计算当前所有要素的热力图信息,通过放大或缩放热力图会动态变化,能够更方便展示店铺热力图信息。计算热力图是以当前所有店铺。同样的,使用清空图层按钮可以清空热力图图层。

店铺信息管理

店铺概览页面可展示店铺的id、名称、地址、所在地、营业状态、联系电话等,整个表格支持翻页动态加载。在表格最上方,可根据店铺名称对店铺进行检索。旁边的下拉栏可根据区划对表格信息进行筛选。

点击添加按钮,可新增店铺。

选择新增所在区划,点击位置拾取可以跳转到首页进行坐标拾取,自动进行地理逆编码并填充经纬度信息。依次输入分点名称、联系电话、和当前状态点击确认即可添加新店铺至地图上并更新当前的表格。

库存信息管理

进入店铺库存信息有两种方法,第一种是前面提到的通过首页弹窗中的“编辑库存”按钮可自动跳转到该店铺的库存信息页面;第二种是在库存信息页面通过搜索框搜索店铺全称,搜索空支持输入联想功能,会动态请求所有店铺并显示在下拉栏中。选中后点击搜索即可显示该店铺的所有库存信息。

本界面支持对现有库存基本信息进行修改,点击修改按钮可以修改当前商品的单价以及库存,状态跟随库存响应式更新,若取消修改会将信息恢复到编辑前的状态,若确认会将信息更新到后端数据库中。

配送申请处理与配送路线规划

配送申请主要用于处理各店铺向配送中心请求的订单信息,点击其中一条的“查看详情”可查看订单信息。

可根据库存情况设置填写相应的订单回执,一般情况默认满足订单的所有请求数量,若当前库存少于订单数量,可手动调低回执订单的请求数量,并且实际货物总价会响应式的发生变化。填写配送时间以及备注,点击提交即可更新订单状态。可一键生成配送路线规划,并在地图显示最优路线。 

 

系统亮点

1.  前端采用当前Vue、webpack、npm等主流技术开发,项目工程化构建,适合项目重建与定制化,有利于系统的可推广性。

2.  结合传统的店铺管理系统与新兴的GIS服务,使得二者各取所长,为管理人员或普通顾客提供更全面的服务。

3.  使用supermap JavaScript iclient和supermap iserver经典搭配实现整个系统的gis服务,具有基础的gis功能例如寻找最近设施并导航、地理要素检索等,也具有热力图分析等专业空间分析功能。

4.  人机界面操作合理流畅、页面更新以及跳转流畅自然,组件美观交互合理,gis服务参数设置最大限度通俗易用,可以使非专业人士也能轻松上手分析工具。

5.   整合前后端分离系统,便于并行开发与维护,项目组件化、模块化使项目可读性大大增加。

 

指导老师点评

该生鲜配送与服务系统实现了商品展示、店铺位置可视化、配送路线规划等现实需求,具有一定的实用价值。并且使用了当前较为流行的技术栈,具有一定的开发难度,前后端分离的开发模式使系统具有完整性和可拓展性。系统界面操作流畅,符合用户使用逻辑,较好地完成了命题开发的各项功能要求,此外还丰富了使用场景中的其他功能,例如使用坐标拾取来新增店铺、库存管理和配送规划等。

 

团队合影

 

从左到右姓名依次是:彭兴涛 李军利

联系我们
高校大赛二维码

GIS大赛公众号