APP下载

消防车辆监控管理平台设计与实现

2020-10-12余瑞向郑涛李鹏飞孟振宇陈宇峰

湖北汽车工业学院学报 2020年3期
关键词:服务器端用水量消防

余瑞,向郑涛,李鹏飞,孟振宇,陈宇峰

(湖北汽车工业学院 电气与信息工程学院,湖北 十堰442002)

2017 年我国应急管理部消防救援局发布了《关于全面推进“智慧消防”建设的指导意见》,要求消防系统应根据救援工作实际需要,提升消防救援水平,并且从宏观层面提供智慧消防建设的顶层设计,为我国消防管理工作提供思路和途径[1]。当前我国消防队伍在智慧消防建设过程中不断探索和实践,通过信息化手段对火灾进行实时监管,解决了消防管理中存在的问题,提高了消防安全管控能力。消防技术取得一定进步的同时,也存在一系列问题亟待解决。传统的消防管理模式已不能适应当前需求,传统的消防设备缺少内部传感器,无法通过信息化手段实时监测车辆各种数据,如车辆用水量、用油量、车辆实时位置等数据。较为突出的是旧系统处理数据能力不足问题,消防平台收集的各项数据存放在不同类型的数据存储系统中,系统中不同模块缺少信息联通,且存储系统相互关联不够紧密,导致数据的资源利用率降低,数据可读性和实用性较低,未能为用户提供直观准确的数据分析和参考[2]。为保证消防任务的处理速度不断提高,文中设计了消防车辆监控管理平台,为消防部门人员提供了准确的消防车辆信息数据,实现了消防车辆数据信息化、系统化、安全化管理。

平台主要使用RESTful 架构[3],简化了Web 程序开发,提供了大量的扩展点,具有良好的可扩展性,并且方便程序进行自定义功能,实现了用户交互以及个性化定制等功能。在采用RESTful 架构基础上,结合异步Ajax技术,实现前端界面局部更新,减少了用户等待时间,提高页面加载速度,满足用户的需求。在处理服务器数据时统一使用json数据格式,实现对数据的快速编写和读取,采用了异步交互的ECharts 图形,对数据进行实时更新显示,最终完成消防车辆监控管理平台的设计与实现[4]。平台采集消防车辆在日常工作以及处理火灾过程中的实时状态和位置信息、车辆用水量用油量信息、报警阈值提醒信息以及车辆配置管理信息,将数据以清晰准确的方式在前端进行页面显示,保障消防管理人员能够随时准确掌握消防车辆相关信息,为灭火救援工作提供数据和技术支持。通过测试,平台能够对消防车辆进行高效准确管理,提高了消防部门工作效率。

1 平台架构设计

消防车辆管理平台架构如图1所示,由消防车辆车载终端和消防车辆监控管理平台组成。消防车辆车载终端通过传感器采集油量、水量信息,根据车辆实时运行情况动态设置水量、油量相关参数和采样频率,定位卫星采集消防车辆实时位置信息,一起上传给数据解析服务器。数据解析服务器将解析好的数据导入数据库,数据库服务器完成数据信息的存取。业务服务器根据业务逻辑需求建立与数据库的连接,并负责分析、处理、调用数据。Web服务器主要负责前端的界面显示,前端界面是实现用户和应用交互的核心方式,通过良好的界面设计能够给用户提供直观的体验,有效减轻后台处理的压力。

图1 消防车辆管理平台架构图

文中聚焦Web 服务器端消防车辆监控管理平台的设计与实现。针对目前消防救援队伍的实际需求,采用消防车辆监控管理平台可视化界面,为用户提供所需要的车辆相关信息,考虑实际救援过程中多种因素(火点位置、固定加水点位置、消防车自身配置等信息),实现消防车辆的综合调度和管理。设计时密切关注多个子系统和模块之间的联通,提高监控管理平台的联动性。通过对数据的统一管理和挖掘分析,实现数据资源高效利用,为消防工作提供正确的预判和合理布局,提升消防管理水平和工作效率。

2 消防车辆监控管理平台需求分析

图2 消防车辆监控管理平台功能结构图

消防车辆监控管理平台功能结构图如图2 所示,由实时信息展示、系统信息管理、查询统计、参数设置4个需求功能模块组成。通过需求分析,确保平台对车辆实时信息进行监控管理,及时掌握车辆出行历史路线数据,为管理人员及用户提供准确的消防车辆水量油量信息。

1)实时信息展示模块 实现消防车辆实时信息动态展示,包括车辆基本信息、车辆位置信息、用水量和用油量信息。车辆基本信息包括车辆种类、车牌号、所属部门、驾驶员等信息,根据用户的类型和权限,可以对车辆基本信息进行维护。采集的实时位置信息和行驶轨迹路线信息经过处理分析,通过地图进行显示,为消防员进行消防工作提供更加准确的路径规划,便于消防车辆的调度和安排。用水量、油量信息通过不同类型图形动态显示,相关信息图形化显示为消防人员提供直观的数据参考,通过准确的统计数据可以保证车辆水量、油量能够得到及时补给,提高消防队员的工作效率。

2)系统信息管理模块 实现用户个人信息登录、新用户注册、忘记密码等操作。点击用户个人信息登录界面,填写用户名、密码和用户权限后直接跳转到主界面。根据用户角色不同,将用户权限设置为普通用户、管理员、超级管理员3个权限,用户权限越高,可操作的范围越广。用户权限设置避免出现未经授权的操作,屏蔽可能带来系统崩溃的数据录入,使平台性能更加稳定。未注册的用户可以通过填写用户名、所属部门、车辆类型、手机号码等关键信息对账户进行注册,方便登录界面进行信息查看。忘记密码可以解决部分用户密码信息遗忘丢失问题,使数据更加安全地保存和读取。

3)查询统计模块 实现车辆历史轨迹查询和信息条件查询。车辆历史轨迹信息以地图形式显示,通过高德地图进行车辆轨迹绘制分析,结合车型、驾驶员、出行历史数据,对驾驶行为进行分析并提供路线指导。信息条件查询包括查询车辆基本信息、用水量、用油量、历史轨迹等信息,车辆基本信息包括车辆类型、所属部门、车牌号、驾驶员等信息,通过填写关键信息,对具体信息进行查询或提交操作。历史用水量、用油量以柱状图、折线图等图表形式显示,通过图表将数据的变化趋势和数值大小直观生动显示出来。

4)参数设置模块 实现对油量采样频率、水量采样频率和报警阈值的设置。根据用水量、用油量信息,统计不同时间段的报警次数,设置报警阈值。当用油量、用水量低于阈值时,系统报警,将数据传送到指挥中心,由指挥中心对消防车辆下一步行为进行综合应急指挥。使用折线图展示报警次数的变化趋势,为消防管理人员提供预警参考。

3 消防车辆监控管理平台

3.1 RESTful架构提高系统性能

考虑平台实际使用范围及界面数据显示效率,采用合适的架构使各系统协同操作,实现系统跨平台使用。为了提高系统的可交互性和扩展性,使用RESTful 架构,统一资源接口,从而实现不同平台软件之间的通信和数据传输。RESTful 架构具有结构清晰、容易理解、扩展方便等优势[5-6],客户端使用http 统一方法,实现对数据的增、删、改、查工作。get、post、put、delete 对指定的URI 进行不同操作,get 用来获取数据,post 用来新建资源,put 用来更新资源,delete 用来对资源进行删除操作,实现对数据的管理和访问,使数据描述准确简单,减少网络负载,增加了客户端的灵活性。设计RESTful返回码时,遵循http 状态码分布的区间范围,服务器端使用http 响应,数据采用标准格式传输,使用统一的状态码进行状态描述,使响应易于理解、结构清晰,为客户端提供具体的信息提示。图3 为RESTful架构示意图。

图3 RESTful架构示意图

平台基于RESTful 架构,使用设置好的通用接口,定义合适的数据传输格式和响应,将系统相关资源进行统一描述和管理,实现资源的规范化操作。定义和设计统一接口时,遵循安全性和幂等性原则[7]。安全性需要在与用户信息有关的请求上携带身份认证信息,当外系统对接口访问时不改变服务器端的资源状态。平台包含用户权限设置功能,只有Admin 和Manager 角色可以对用户成员进行delete请求,保证系统的安全性。幂等性是指在1 次和多次访问同一接口的情况下对资源状态改变的效果相同。接口使用幂等性原则可降低消防车辆管理系统实现的复杂性,从根本上解决重复操作的问题,有利于减少系统各模块之间的耦合性,提高系统各模块的独立性和扩展性。

以表单操作为例,使用put 请求后,客户端向服务器发送数据,使修改数据的内容遵循幂等性原则,即使重复提交put 操作也不会增加数据的种类,只改变URL 中指定的资源,在发送put 请求时需要携带name="_method"的隐藏域,其值为PUT。请求页面核心代码如下:

传统架构中前端开发过程中严重依赖后端,职责边界模糊不清,前端无法单独调试,操作较为复杂,而且性能较差,须在后端完成接口设置之后才能进一步工作,影响整体的工作效率。使用REST⁃ful 架构实现了客户服务器端分离,可分别对客户端和服务器端进行优化和改进,缩短了整个项目的开发周期,为开发人员提供便捷。

3.2 json格式进行数据传输

平台通过可视化界面显示大量的车辆基本数据和信息,为消防部门提供直观的数据分析结果。选用合适的数据传输格式,从后台快速读取数据,直接进行数据解析,提高终端和平台之间数据传输效率。在数据传输过程中,客户可通过服务器端进行数据提交,服务器端处理完数据后,将大量的数据结果回传给客户端,此时需要合适的数据格式来解决数据快速组装和解析问题。json 是一种轻量级数据交换格式,能够在服务器端进行数据交换,不仅可以使用键值对简单列表形式封装数据,而且可以用来表示数组和复杂对象,具有结构简单、可读性好、解析数据迅速等优点[8]。为了展示不同类型车辆用水量,需要读取车辆用水量与车辆类型,以cardate.json 文件为例,文件内包含的字段使用json格式如下:

[{"value":38,"name":"小型车辆"},{"value":47,"name":"中型车辆"},{"value":23,"name":"大型车辆"}];

$.getJSON("json 文 件 地 址",function(data){...})方法主要用来从服务器获取cardate.json文件内的数据,获取的数据存放在函数的data 参数中。车辆用水量数据读取方法如下:

$.getJSON('cardate.json',function(data){//此处返回data数据的json对象

console.log(data);//打印数据,便于前台分析

var namelist=[];//返回的数组

var barlist=[];

for(var i=0;i

barlist.push(data[i]);

namelist.push(data[i].value);}

选用json格式对数据进行封装处理,从Web服务器上读取json文件内数据,并且将json数据转换为JavaScript 进行解析。在服务器端直接使用json数据格式,简化了服务器端和客户端代码的开发量,提高了数据解析速度和传输性能,不仅使数据传输更快更灵活,还缩短了数据检索时长,提升了平台的整体性能,实现终端与平台的交互。

3.3 异步Ajax技术实现动态请求

传统Web开发采用同步通信方式,通过请求、刷新、响应的模式进行开发,每个请求需要1 个单独的界面显示,发送1个请求就会重新获取这个界面,刷新必须等整个界面都加载出来后才能显示。数据传输完全建立在上一步的基础上,进行系统之间的数据传输时,如果传输数据量较大,传输效率降低,服务器响应时间随之增加,最终导致用户界面的响应比本地应用慢很多[9]。异步Ajax 技术可以很好地解决上述传统Web 应用存在的问题。Ajax 技术和优秀的交互设计为Web 应用提供了广阔的平台,在Google Maps、微软的Windows Live、Yahoo!的Flickr 等都是基于Ajax 技术来建造,为用户提供了很好的体验[10]。

为了提高平台服务性能,采用Ajax 技术在服务器端和客户端之间实现异步通信,加快页面响应速度,实现数据的高效传输。浏览器提交数据时,Ajax技术将数据进行处理并交给服务器,从服务器端接收返回的数据,无须等待数据反馈,减少了浏览器和服务器间的数据传输量,实现了用户在不刷新界面的情况下更新数据的功能。图4 为Ajax 请求方式及用户操作流程。

图4 Ajax请求方式及用户操作流程

实际开发中需要前后端数据的交互,为了能直观地将数据加载到页面的表格中去,使用Ajax 代码实现今日事项表格的显示。URL实现了Ajax 方法跳转地址,用来处理请求并返回参数。type类型请求方式设置为post,参数类型为string 类型,datatype 显示了提交的数据类型为json 格式。在html 页面使用html 和css 将表格写出来,通过使用Ajax 方法动态获取后台数据,循环获取数组,最后调用回调函数,加快了数据加载速度,使用户清楚得到所需要的信息。

3.4 ECharts可视化直观展示数据变化

可视化技术能够直观地体现数据的关键特征,将复杂的海量数据以图形、图像展示出来。ECharts(Enterprise Charts)是百度前端团队开发的纯Javascript 的图表库,可以在PC 端和移动端使用,根据用户个人需求,实现个性化定制数据的可视化图表[11]。ECharts 具有丰富的图表类型,提供了常用的折线图、柱状图、饼状图、散点图等图形,提供了基于地理位置、数据关系的关系图以及多维坐标图等图形,图形视觉编码方式多样,使界面展示更加丰富,并且提供了良好的用户体验。

平台利用ECharts组件对车辆基本数据进行可视化分析,更加清楚便捷地为用户展示动态数据变化。ECharts 官网上具有多种类型开源示例代码,在编写代码时直接可以导入js文件,在代码部分声明ECharts.js 文件,并在页面创建有具体大小的div容器,容器id设置为line,style 内部可以设置样式,然后初始化ECharts 实例,使用option 设置相应参数和属性,调用ECharts.ini 方法。在ECharts 折线图中使用dataZoom 组件,实现区域缩放,其中startValue表示数据窗口范围的起始数值,type 类型使用了slider 滑动块,通过拖动滑块使数据完整呈现出来。区域缩放让用户能清楚查看数据的变化趋势,为用户提供某些特定数据信息。图5 是基于ECharts 的折线图,展示了当月报警次数的变化趋势,坐标轴可以进行缩放伸展,不同颜色清楚显示报警的次数,右上角图例将对应颜色的折线图数据进行隐藏和显示,为消防管理人员提供重点预警参考。

图5 报警次数折线图

3.5 平台实现效果

通过多次测试和调试,平台界面显示效果与加载速度达到了设计要求,效果展示如图6所示。以实时动态地图显示为例,当车辆沿着指定的消防路线行驶时,车载终端收集车辆位置信息并上传至服务器,服务器处理后将信息推送给平台,平台结合驾驶员、出行历史数据实现驾驶行为分析和路线指导。前端显示界面采用JSP动态网页技术,使用丰富的插件,结合css 布局样式和jQuery EasyUI 库,使文档操作更加方便,制作出的动画效果更真实,数据传输使用异步Ajax技术,采用json数据交换格式,为平台提供了技术支持。

图6 消防车辆监控管理平台实现效果

4 总结

文中为消防救援队伍定制了消防车辆监控管理系统,将消防车辆基本信息、实时状态以及用水量、用油量进行图表可视化展示,使用户直观准确地感知数据。根据需求分析对系统功能及架构进行整体设计,通过多次实验测试,平台页面能够准确直观地进行实时数据显示,界面动态响应速度较快,页面功能规范完善,提高了用户使用效果。后续将进一步提高数据分析处理能力,将数据更高效美观地进行可视化呈现。

猜你喜欢

服务器端用水量消防
《消防界》征稿启事
你的用水量是多少?
你的用水量是多少?
全国消防日11月9日
澳大利亚研发出新型农业传感器可预测农作物用水量
Linux环境下基于Socket的数据传输软件设计
漫画说消防
消防也幽默
基于Qt的安全即时通讯软件服务器端设计
基于Qt的网络聊天软件服务器端设计